停止动画*和*阻止完整的动作运行？

Question

我正逐渐淡出背景：

// in:
$bg.css({'pointerEvents':'auto'}).show()
    .stop(true).animate({ 'opacity': 0.90 }, animTime);

// out:
$bg.css({'pointerEvents':'none'}).stop(true)
    .animate({ 'opacity': 0 }, animTime,function () { $bg.hide(); });

问题发生在我开始逐渐消失之前开始淡入它;完整的事件将通过淡入动画部分触发并隐藏背景。

我猜.stop(true)并不能清除完整的事件 - 我有什么方法可以做到这一点吗？

Answer 1

试试.stop(true,true)。这将停止当前事件并删除排队事件。

  

.stop( [clearQueue] [, jumpToEnd] )
  clearQueueA布尔值，指示是否也删除排队的动画。默认为false   jumpToEndA布尔值，指示是否立即完成当前动画。默认为false。

Answer 2

找到了解决方法：

$bg.data('fading',true).css({'pointerEvents':'auto'}).stop(true).show().transition({ 'opacity': 0.90 }, animTime, function () { $bg.data('fading', false); });

$bg.css({'pointerEvents':'none'}).stop(true).transition({ 'opacity': 0 }, animTime,function () {
    if(!$bg.data('fading')) {
        $bg.hide();
    }
});