JSFiddle - React, Tailwind, and code Playground

HTML

<h1>ElementStack.js</h1>
<p>Click on one of the images to toggle stacks</p>

<div id="wrapper">
<img width="75" height="75" src="http://farm3.static.flickr.com/2697/4106711273_969cc50546_s.jpg" />
<img width="75" height="75" src="http://farm3.static.flickr.com/2639/4142476380_7b928bdd6d_s.jpg" />
<img width="75" height="75" src="http://farm3.static.flickr.com/2607/4194526085_a129ff3485_s.jpg" />
<img width="75" height="75" src="http://farm4.static.flickr.com/3298/3502874366_d73cb0f6fe_s.jpg" />
<img width="75" height="75" src="http://farm3.static.flickr.com/2630/3795161224_1012daa415_s.jpg" />
<img width="75" height="75" src="http://farm3.static.flickr.com/2736/4158101064_89f08e4bff_s.jpg" />
<img width="75" height="75" src="http://farm4.static.flickr.com/3524/3880365897_682521f7b9_s.jpg" />
<img width="75" height="75" src="http://farm5.static.flickr.com/4072/4208775604_8d1e65578d_s.jpg" />
<img width="75" height="75" src="http://farm5.static.flickr.com/4005/4247684077_6848f141ff_s.jpg" />
</div>

CSS

body {
    background: url(http://img263.imageshack.us/img263/343/darkwoodsx7.jpg);
    font-family: "Georgia", "Times New Roman", serif;
    font-size: .8em;
    color: #fff;
    text-align: center;
    text-shadow: 0 -1px 0 #000;
}

h1 {
    font-size: 1.7em;
    line-height: 150%;
}

#wrapper {
    position: relative;
    height: 320px;
    width: 280px;
    margin: 15px auto;
}

img {
    position: relative;
    float: left;
    padding: 0;
    margin: 5px;
    -webkit-box-shadow: 0 0 5px #000;
    -moz-box-shadow: 0 0 5px #000;
    border: solid 2px #FFFAF2;
    border-bottom: solid 15px #FFFAF2;
    -webkit-transition: -webkit-transform 0.20s ease-in-out;
    -moz-transition: -moz-transform 0.20s ease-in-out;
}

JavaScript

/*
---
script: ElementStacks.js
decription: ElementStacks stacks elements/images on top of each other with a funky transition
license: MIT-style license.
authors:
 - Oskar Krawczyk (http://nouincolor.com/)
requires:
  core:1.2.4:
  - Class.Extras
  - Array
  - Function
  - Event
  - Element.Style
  - Element.Dimensions
  - Fx.Morph
  - Fx.Transitions
provides: [ElementStacks]
...
*/

// bigger demo: http://nouincolor.com/ElementStack/

var ElementStacks = new Class({
    Implements: [Options],
    
    options: {
        maxRotation: 20,
        delay: 40,
        duration: 600,
        transition: 'back:out',
        position: 'middle',
        specific: 1,
        customPosition: $empty
    },
    
    initialize: function(selector, wrapper, options){
        this.setOptions(options);
        
        this.pos,
        this.wrapper = wrapper,
        this.stackItems = selector,
        this.trigger = $pick(this.wrapper, this.stackItems[0].getParent());
        
        this.setDefaults();
    },
    
    setDefaults: function(){
        this.stackItems.each(function(stackItem){
            this.pos = stackItem.getPosition(this.wrapper);

            stackItem.store('default:coords', this.pos);
        
            stackItem.set('styles', {
                top: this.pos.y,
                left: this.pos.x
            });
    
            stackItem.set('morph', {
                transition: this.options.transition,
                duration: this.options.duration
            });

            // Need to delay this, otherwise the top/left
            // position will be set to zero (Moo bug?)
            (function(){
                this.setStyle('position', 'absolute');
            }).delay(1, stackItem);
        }, this);
        
        this.initPosition();
        this.attachActions();
    },
    
    initPosition: function(){
        
        var Positioner = {
            'first': function(){
                return this.stackItems[0];
           ...