Sha256: f924dfb8a48186d3a7a91d1c1987bd2df31dd66c297f72f0dfbfc64a6983e46f
Contents?: true
Size: 1.89 KB
Versions: 7
Compression:
Stored size: 1.89 KB
Contents
<style type="text/css"> #sorter { padding-left: 15px; } #sorter li { border: 1px solid #666; margin: 8px; padding: 4px; } div.spanner { float: left; margin: 4px; padding: 2px; border: 1px solid #000; } </style> <ol id="sorter"> <li id="li0">(0) stuff</li> <li id="li1">(1) more stuff<br /> really</li> <li id="li2">(2) still more stuff</li> <li id="li3">(3) loads o stuff</li> <li id="li4">(4) blah<br /> blah<br /> blah</li> </ol> <div class="spanner">one</div> <div class="spanner">two</div> <div class="spanner">three</div> <div class="spanner">four</div> <div class="spanner">five</div> <script src="/depender/build?require=More/Fx.Sort,Core/Element.Event,Core/Fx.Transitions"></script> <script type="text/javascript"> var vert = new Fx.Sort($$('#sorter li'), { transition: Fx.Transitions.Back.easeInOut, duration: 1000 }); var horz = new Fx.Sort($$('.spanner'), { mode: "horizontal", transition: Fx.Transitions.Back.easeInOut, duration: 1000 }); makeActions([ { title: "Reverses the order of the lists to 5,4,3,2,1", fn: function(){ vert.backward(); (function(){horz.backward();}).delay(1000); } }, { title: "Resets the order of the lists to 1,2,3,4,5", fn: function(){ vert.forward(); (function(){horz.forward();}).delay(1000); } }, { title: "Sets the order of the lists to 5,2,4,3,1", fn: function(){ vert.sort([4,1,3,2,0]); (function(){horz.sort([4,1,3,2,0]);}).delay(1000); } }, { title: "Swaps the position of 1 and 5", fn: function(){ vert.swap(0,4); (function(){horz.swap(0,4);}).delay(1000); } }, { title: "Reverses the order of the lists", fn: function(){ vert.reverse(); (function(){horz.reverse();}).delay(1000); } }, { title: "Reorders the DOM to match the current sort order.", description: "(No visible effect; inspect in firebug.)", fn: function(){ vert.rearrangeDOM(); } } ]); </script>
Version data entries
7 entries across 7 versions & 1 rubygems