1

このページが FireFox と safari では問題なく表示されるのに、Chrome と IE では迷惑なジャンピング フレームがほとんどないように見える理由を誰か教えてください。

スクロールに応じて<セクション>を上下に移動するために0遅延のアニメーションを使用しているため、あるセクションが前のセクションを食い尽くしているように見えますが、背景だけでなくセクション全体も視差のようなものです。

http://bksn.mx/tequilaarsenal/public/index/arsenal

私の JavaScript コードのコメントはスペイン語ですが、必要に応じて喜んで翻訳します。

これを行う JavaScript コードの簡単な例を次に示します。

tempScrollTop=0;
$(window).scroll(function(e) {

    windowTop = $(window).scrollTop(); 

    scrollDiff = tempScrollTop-windowTop;

    $("#sectionToMove").parallaxMio(p0,scrollDiff);
    tempScrollTop = windowTop;

});


$.fn.parallaxMio = function(pInicial,scrollDiff){
    if (scrollDiff < 0 ){
        //scroll down
        $(this).stop().animate({ top: '+='+scrollDiff }, 0);
    else if (scrollDiff > 0){
        //scroll up
        $(this).stop().animate({ top: '+='+scrollDiff }, 0);

    }

};
4

1 に答える 1

1

次のようなものを使用できます。

$(window).scroll(function(evt) {
    var e = window.event || evt
    var scrollDiff = e.detail?e.detail*(-120):e.wheelDelta;
    $("#sectionToMove").parallaxMio(p0,scrollDiff);
});

e.wheelDeltaは FF に存在しe.detail、残りの部分にあり、スクロールの方向と量を示します。またe.wheelDelta、ほとんどの場合e.detail * (-120)です。

PSアドバイスとして、プライベート変数を宣言してみてください（scrollDiffたとえば）。グローバル空間を「汚染」し、「なぜこの変数がウィンドウに存在するのか」、「同じ変数名は正しく機能しません。」

編集：

このリンクも参照してください: http://phrogz.net/js/wheeldelta.html

于 2012-12-18T04:11:46.220 に答える