javascript - 固定位置の要素の幅 Bootstrap

Question

の要素を取得しましたwidth=auto。その要素に追加position: fixedすると、視覚的に幅が変わります。を追加した後、要素の側面を維持するにはどうすればよいposition: fixedですか? 位置が「固定」された応答性の高い中央の要素が必要です。

これは問題の例です（クラスfirstとfirst_top）：http://jsfiddle.net/nWHSH/

Answer 1

問題はfirst_topCSS にありました。

http://jsfiddle.net/gespinha/nWHSH/6/

これで問題は解決するはずです。CSS を次のように変更するだけです。

.first_top {
    position: fixed;
    top: 0;
    background: #FFF;
    z-index: 2;
    left: 0;
    right: 0;
    max-width: 720px;
    margin: 0 auto;
} 

問題は固定位置についてでした。固定要素と絶対配置要素は、実際のドキュメント フローから切り離されているため、他の要素と自然に反応せず、ドキュメント自体と相互作用する傾向があります。

したがって、フロー内の順序を強制するには、そのサム要素をガイドして、主要なフローではないが類似したフローに従わせる必要があります。 DOM 内の他のオブジェクト。

Answer 2

デモ

位置固定後のセンタリング要素

var elem = $('.first');
    var firstTop = elem.offset().top, firstH = elem.height();
    $(window).scroll(function(){
      if( $(window).scrollTop() > firstTop ) {
        elem.removeClass('first_top').addClass('first_top');
        $('.sticker').css({display: 'block', height: firstH});
          $(".first_top").css("left", ($(window).width()- $(".first_top").width())/2);
      } else {
        $('.first').removeClass('first_top');
        $('.sticker').css({display: 'none', height: '0'});
      }
    });