用队列模拟jquery的动画算法实例

2020-05-17 06:27:25易采站长站整理

            element.style.webkitTransform = ‘translate3d(‘ + width + ‘px,0,0)’;

            //监听动画完结
            element.addEventListener(‘webkitTransitionEnd’, function() {
                func()
            });
        }

        var _fire = function() {
            //加入动画正在触发
            if (!fireing) {
                var onceRun = Queue.shift();
                if (onceRun) {
                    //防止重复触发
                    fireing = true;
                    //next
                    onceRun(function() {
                        fireing = false;
                        //这里很巧妙的产生了连环调用的效果
                        _fire();
                    });
                } else {
                    fireing = true;
                }
            }
        }

        return self = {
            //增加队列
            add: function(element, options) {
                //这里是整个算法的关键