Best Period Picker
copysite.v.3

Online Demo - jQuery Animated Sort Plugin - jQuery Plugins

Animated Sort jQuery Plugin


Bubble Sort

  • 23
  • 51
  • 11
  • 44
  • 8
  • 99
  • 3
  • 62
  • 33
  • 16
  • 70
  • 85

Example Code

$("#bubble-list").animatedSort({animationTrigger:{event: "click", selector: "#bubble-sort"},   resetTrigger:{event: "click", selector: "#bubble-reset"}});

Selection Sort

  • 1
  • 19
  • 66
  • 5
  • 3
  • 79
  • 2
  • 8
  • 25
  • 64
  • 86
  • 34

Example Code

$("#selection-list").animatedSort({listType: [2, 19, 66, 5, 3, 79, 1, 8, 25, 64, 86, 34],   stepTime: 300,   highlightColor: "#05ef21",   sortedColor: "#aa0078",   sortAlgorithm: "selection",   animationTrigger:{event: "click", selector: "#selection-sort"},   resetTrigger:{event: "click", selector: "#selection-reset"},   callback: function(){$(this).css("background-color", "gray")}});

Insertion Sort

  • 37
  • 82
  • 41
  • 16
  • 74
  • 55
  • 18
  • 29
  • 94
  • 91
  • 64
  • 96

Example Code

$("#insertion-list").animatedSort({stepTime: 600,   highlightColor: "teal",   listType:{bottom: 0, top: 100, length: 12},   sortedColor: "#e4701d",   sortAlgorithm: "insertion",   animationTrigger:{event: "click", selector: "#insertion-sort"},   resetTrigger:{event: "click", selector: "#insertion-reset"}});

Quick Sort

  • 64
  • 2
  • 11
  • 89
  • 64
  • 75
  • 36
  • 67
  • 14
  • 55
  • 20
  • 49

Example Code

$("#quick-list").animatedSort({stepTime: 800,   listType:{bottom: 0, top: 100, length: 12},   sortAlgorithm: "quick",   highlightColor: "brown",   sortedColor: "darkgray",   animationTrigger:{event: "click", selector: "#quick-sort"},   resetTrigger:{event: "click", selector: "#quick-reset"}});