单击按钮时取消正在进行的 javascript 介绍

Question

我正在开发一个单页网站，在展示主要内容之前我会先使用介绍。 介绍（大约十秒）立即触发并以这段代码结束：

// Fade in divs for intro

$('.intro-logo').fadeIn(800).delay(800, function() {
    $('.groupC').delay(400).fadeOut(800, function() {
        $('.main-holder').fadeIn(800);
        hash_handler();
        $('.footershow').delay(1600).fadeIn(800);
    });
});

在此事件期间，hash_handler 被触发，它根据 url 中的 # 滚动主页以显示页面的正确部分。

在介绍过程中会显示一个 SKIP 按钮，按下时会遵循以下代码：

function hideIntro() {
    $('.groupC').fadeOut(800);
    $('.main-holder').fadeIn(800);
    hash_handler();
    $('.footershow').delay(1600).fadeIn(800);
}

请告知如何在按下SKIP按钮时取消引入，以避免hash_handler被执行两次。

谢谢，

Answer 1

我希望您使用的是 jQuery。如果正确，您可以像这样使用.stop( [clearQueue ] [, jumpToEnd ] ) method：

$('.groupC').stop(true, false).fadeOut(800);

第一个参数决定 jQuery 是否取消对象的任何未决动画，而第二个参数决定 jQuery 是跳到当前动画的末尾还是将其留在原处。