madrobby / scriptaculous
watch download tarball
public
Forks400Right
Watchers1397Right
Description: script.aculo.us is an open-source JavaScript framework for visual effects and interface behaviours.
Home | Edit | New

List Morph Demo

Demos > List Morph Demo

This is a demonstration of how Effect.Morph can be used to indicate a list reordering to the user. Click anywhere on the list to initiate a random reorder.

Lorem
ipsum
dolor
sit
amet

Source code of this demo


Array.prototype.shuffle = function() {
  return this.sortBy(Math.random);
};

(function() {
  function foo() {
    $('scripty_morph_demo').select('div').shuffle().each(function(e, i) {
      e.morph('top:' + i*e.getHeight() + 'px', { duration: 0.4 }); 
    });
  }
  $('scripty_morph_demo').observe('click', foo);
  foo();
})();

Pages feed

Last edited by vjmcfly, Fri Jan 16 05:19:49 -0800 2009
Home | Edit | New
Versions: