0

横にスクロールしたり、「新しいページ」のボタンを使用したりできる Web ページを作成しています (注: ボタンを使用すると、前のページをすばやくスライドでき、新しいページは読み込まれません)。

指定したページが表示されると、フラッシュで作成したアニメーションがトリガーされます。私はそれを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. false であることが判明した場合、scrollハンドラーは何もしません。visibleユーザーがスクロールしてアニメーションが表示されなくなった場合、次の 2 つのことを行う必要があります。(a) タイムアウトをキャンセルする必要があります。(b) siffy アニメーションを停止する必要があります。if (visible)代わりに、ブロックにはブロックがないため、何も起こりませんelse

  3. コードが示す時点でif($AnimatieAan)、変数$AnimatieAanは常に true です。(2 行前に true に設定しただけです。) したがって、elseそこにあるブロックは実行できません。それは不可能だ。

そのelseブロックにあるコードはほぼ正しいように見えますが、間違いなく間違ったif.

于 2012-08-23T10:20:16.883 に答える