如何使事件等到jQuery翻转效果完成?

时间:2012-01-07 03:08:37

标签: jquery

我遇到了问题,我有这个代码:

$(document).ready(function(){
    /* The following code is executed once the DOM is loaded */

    $('.clsks').mouseenter(function() {

        var ob = $(this);
        var dar = $(this).attr('ids');
        var obj1 = $('#sponsorFlip'+dar);
        var obj2 = $('#sponsorData'+dar);

        obj1.flip({
                direction:'lr',
                speed: 350,
                onBefore: function(){
                    // Insert the contents of the .sponsorData div (hidden from view with display:none)
                    // into the clicked .sponsorFlip div before the flipping animation starts:
                    obj1.html(obj2.html());

                }
            });

            // Setting the flag:
        //obj1.data('flipped',true);

        }).mouseleave(function() { var dar = $(this).attr('ids');
        var obj1 = $('#sponsorFlip'+dar); obj1.revertFlip(); });

});

我需要让事件mouseenter等到这个jQuery翻转完成cuz有时如果有人快速鼠标离开就会失败cuz'obj1.html(obj2.html());'在它上面。

但我只需要让mouseenter事件等待jQuery翻转完成。

1 个答案:

答案 0 :(得分:0)

请参阅文档了解翻转方法:http://lab.smashup.it/flip并添加onEnd:函数。这是该文档的一个例子:

$("#flipbox").flip({
    direction:'tb',
    onBefore: function(){
            console.log('before starting the animation');
    },
    onAnimation: function(){
            console.log('in the middle of the animation');
    },
    onEnd: function(){
            console.log('when the animation has already ended');
    }
})