0

我正在构建一个网页，您可以在其中横向滚动或使用“新页面”按钮（注意；当您使用按钮时，您会快速滑过以前的页面，它不会加载新页面）。

当指定页面出现时，它应该会触发我用 flash 制作的动画。我通过 swiffy 对其进行了转换，并且可以正常工作。触发动画效果很好，但问题是：例如，当您按下按钮将引导您进入带有动画的页面之后的页面时，“页面”仍然会触发，因为它曾经在视图中。

现在我正在尝试使用 timeOut 来延迟动画，这样当你滚动它时，它不应该触发，除非你在页面上停留超过 X 秒。

这是我当前的脚本：

    var $AnimatieAan = false;
    var $Zichtbaar = false;
    $(window).scroll(function(){
        $e = $('#searchEngine');

        var visible = $(window).scrollLeft()+window.innerWidth>$e.offset().left&&$(window).scrollLeft()<$e.offset().left+$e.width();

            if(visible)
            {
                $Zichtbaar = true;
                var Timer = setTimeout(function()
                {
                    console.log('timerstart');

                    if($Zichtbaar)
                    {
                        //$Zichtbaar = true;
                        console.log($Zichtbaar)
                        $AnimatieAan = true;
                        $Zichtbaar = false;
                        if($AnimatieAan)
                        {
                            var stage = new swiffy.Stage(document.getElementById('searchEngine'), mexaleSearch);
                            stage.start();
                            console.log(visible);
                            $AnimatieAan = false;
                        }
                        else 
                        {
                            clearTimeout(Timer);

                            console.log('clearTimeout');
                            $Zichtbaar = false;
                            $AnimatieAan = false;
                            stage.stop();
                        }
                    }                       
                } , 2000 );
            }

关于滚动如何工作的说明，工作版本在 www.mexale.com

任何帮助将不胜感激！

4

1 回答 1

0

这里有几个问题。

  1. 因为Timer是处理程序中的局部变量，所以scroll每次滚动事件发生时，您都会得到一个全新的、完全不相关的变量。这意味着Timer不会记住从一个事件到下一个事件的值。要解决此问题，请在处理函数var Timer的范围之外创建一个。scroll

  2. 如果结果是假的，scroll处理程序不会做任何事情。visible当用户滚动以使动画不可见时，您希望发生两件事：（a）应该取消超时；(b) 快速动画应该停止。相反，什么也没有发生，因为该if (visible)块没有else块。

  3. 在代码显示的地方if($AnimatieAan)，变量$AnimatieAan始终为真。（我们之前只是将它设置为 true 两行。）所以else那里的块不能运行；不可能。

您在该else块中的代码看起来是正确的，但它肯定附加到了错误的if.

于 2012-08-23T10:20:16.883 回答