使用淡入淡出淡出动画时重叠的 div

Question

遇到了一个奇怪的问题.. :-( 我正在根据用户点击淡化 div，一切正常，但是当用户以更快的速度在链接之间切换时，我最终会出现重叠的 div。可以任何人都分享我如何解决这个问题的线索.. jsFiddle如下

jsFiddle Link

Answer 1

您可以设置一个标志来中止进一步的点击，直到动画完成：

$(document).ready(function() {
    var running = 0
    $('.page-slide').click(function() {
        if(running==1) {
            return
        }
        running = 1
        var getId = $(this).attr('rel');

    $('.rightCol:visible').fadeOut( 'fast', function() {
        $('#'+ getId +'').fadeIn( 'slow',function(){running=0} );
    });

    });
});