swing 弹性摇摆效果的卡片js拖拽插件

var stack,

    cards;

// Prepare the cards in the stack for iteration.

cards = [].slice.call(document.querySelectorAll('ul li'))

// An instance of the Stack is used to attach event listeners.

stack = Swing.Stack();

cards.forEach(function (targetElement) {

    // Add card element to the Stack.

    stack.createCard(targetElement);

});

// Add event listener for when a card is thrown out of the stack.

stack.on('throwout', function (e) {

    // e.target Reference to the element that has been thrown out of the stack.

    // e.throwDirection Direction in which the element has been thrown (Card.DIRECTION_LEFT, Card.DIRECTION_RIGHT).

    console.log('Card has been thrown out of the stack.');

    console.log('Throw direction: ' + (e.throwDirection == Card.DIRECTION_LEFT ? 'left' : 'right'));

});

// Add event listener for when a card is thrown in the stack, including the spring back into place effect.

stack.on('throwin', function (e) {

    console.log('Card has snapped back to the stack.');

});

var stack,

    config;

config = {

    /**

     * Invoked in the event of dragmove.

     * Returns a value between 0 and 1 indicating the completeness of the throw out condition.

     * Ration of the absolute distance from the original card position and element width.

     * 

     * @param {Number} offset Distance from the dragStart.

     * @param {HTMLElement} element Element.

     * @return {Number}

     */

    throwOutConfidence: function (offset, element) {

        return Math.min(Math.abs(offset) / element.offsetWidth, 1);

    }

};

stack = stack = Swing.Stack(config);

var stack,

    card;

stack = stack = Swing.Stack();

card = stack.createCard(HTMLElement);

card.throwOut(Card.DIRECTION_LEFT, 0);

card.throwOut(Card.DIRECTION_RIGHT, 0);

var stack,

    card;

stack = stack = Swing.Stack();

card = stack.createCard(HTMLElement);

card.on('throwout', function () {});

stack.on('throwout', function () {});

var stack;

stack = stack = Swing.Stack();

stack.on('throwout', function (eventObject) {});