0

通常、これらのことは理解できますが、私が見る限り、このコードは実際のオフセットから約 700 ピクセルずれているようです。

私がここで行っているのは、基本的に、スクロールして固定ヘッダーのすぐ下にあるボタンをロックすることです。コンソール出力をテストすると、このコードによると、ボタンが上から約 713 ピクセルの位置にあることがわかります。ただし、実際には上から約 1300 ピクセルです。713 ピクセルは別の要素のほぼ真ん中を参照するため、論理的にその数を取得することは不可能です。

これが私のコードです。

    window.contOffset = jQuery('#cont-step3').offset();
    window.contWidth = jQuery('#cont-step3').outerWidth();
    jQuery(window).scroll(function(){
        if(window.contOffset.top<jQuery(document).scrollTop()){
            jQuery('#cont-step3').css({
                position:'fixed',
                top:'70px',
                left:window.contOffset.left+'px',
                width:window.contWidth+'px'
            });
        }else{
            jQuery('#cont-step3').removeAttr('style');
        }
        console.log(window.contOffset,jQuery(document).scrollTop());
    });
    jQuery('#core-values2').sortable({
        update:function(event,ui){
            updateValues();
        }
    });

このコードの私のロジックは、ユーザーが要素をスクロールして通過したときです (約 1300 ピクセルですが、サイトは応答性が高いため、計算する必要があります)。要素にインライン スタイルを追加して、固定位置を指定します。ユーザーが上にスクロールすると、それが削除されます。非常に単純な概念であり、多くのコードは必要ありませんが、この問題は私を困惑させ、最大で 5 分かかるスクリプトの場合、既に 2 時間のデバッグに費やしました。

他の誰かがこれに遭遇しましたか？私は何かを完全に見逃していますか？私は以前に同様の方法を使用しましたが、問題はありませんでした。

jQuery 1.10.2 を使用しています

ここで進行中のフィドル jsfiddle はスクロール/許可しないため、この例ではテストを試みるためにさらに何かが必要になる場合があります。

4

1 に答える 1

0

問題は、dom の完了をチェックするだけでなく、dom のすべての変更でイベントを再初期化することでした。プロパティ (メニューなど) を変更する可能性のある他の JavaScript は、スクロール イベントをスローします。

何かに変更が加えられるたびに、関数をフックして削除し、イベントを再初期化することができました。

jQuery(window).off('scroll').on('scroll',function(){
        if(window.contOffset.top<jQuery(document).scrollTop()){
            jQuery('#cont-step3').css({
                position:'fixed',
                top:'70px',
                left:window.contOffset.left+'px',
                width:window.contWidth+'px'
            });
        }else{
            jQuery('#cont-step3').removeAttr('style');
        }
        console.log(window.contOffset,jQuery(document).scrollTop());
    });
于 2013-09-26T19:00:39.737 に答える