0

ユーザーが親divの特定のポイントを超えてスクロールすると、「固定」クラスが追加されるdivがあります。固定クラスは、子 div を絶対配置から固定配置に変更するだけです。

ただし、(js の「begin 変数」で指定されているように)「fixed」クラスが追加されたときに、ユーザーが特定のポイントまでスクロールすると問題が発生します。ユーザーは、数秒間上下にスクロールできなくなります。さらに複雑なことに、この問題は、このコードを使用する 6 つの親 div のうち最初の div でのみ発生します。

「固定」クラスを追加するjqueryコードは次のとおりです。

var begin = 164;

$("#portfolio_window").scroll(function () {     
    var y = $(this).scrollTop();

    if (y >= begin) {
        $('.details').addClass('fixed');
    } else {
        $('.details').removeClass('fixed');
    }
});

「begin」変数を 600 などに変更すると、ユーザーは div の上部から 600px 前後スクロールできなくなります。

http://dev.zachboth.com/で問題の再現を試みることができます。

問題を再現できる最も簡単な方法は次のとおりです。

  • サファリを使う
  • 「作品」欄の「各種ロゴ」をクリック
  • 「さまざまなロゴ」セクションが表示されたら、すばやく下にスクロールします
  • 実際に問題が発生するまでに数回の試行が必要な場合があります
4

1 に答える 1

0

私はあなたの問題を説明することができます:

問題は、あなたが壊れていると言っている「ページ」で、div#portfolio_windowをスクロールしていることです。あなたが言及したposition:fixed要素はウィンドウに対して相対的な位置にあります。その要素をスクロールすると、(親divではなく)ウィンドウをスクロールしようとします。

http://jsfiddle.net/NThY7/

解決策はもう少し複雑です。後で解決策を紹介します。

于 2013-01-08T22:48:15.850 に答える