0

固定クラスをサイドバーに適用する JavaScript があるので、スクロールしてもメニューが表示されたままになります。Stackoverflow には、同様の質問のサイドバーがあります。

    $(function() {      
    var top = $('.side-menu').offset().top - parseFloat($('.side-menu').css('margin-top').replace(/auto/, 0));
    $(window).scroll(function (event) {
      // what the y position of the scroll is
      var y = $(this).scrollTop();

      // whether that's below the form

      if (y >= top) {

        // if so, ad the fixed class
        $('.side-menu').addClass('fixed');
        $('body').addClass('fixed-sidebar');

      } else {
        // otherwise remove it
        $('.side-menu').removeClass('fixed');
        $('body').removeClass('fixed-sidebar');
      }
    });
});

私のCSSには* { box-sizing: border-box; }、elseが起動してページがジャンプする原因となっているものがあります。ボックスのサイズ変更を削除すると、固定メニューが希望どおりに機能します。

私の質問は

  • 私がやろうとしていることを達成する別の方法はありますか?
  • box-sizingプロパティの設定を解除する方法はありますか?

編集

デモについては、このリンクを使用してください: さまざまな高さでブラウザー ウィンドウのサイズを変更すると、問題が表示されます。http://dev.danielcgold.com/fixed-menu.html

4

1 に答える 1

1

もちろんいつでもできます(selector) { box-sizing: content-box }。（それはあなたの「設定を解除」しますbox-sizing...）

于 2012-08-16T16:25:42.380 に答える