1

下にスクロールしたときに要素が上に表示されたままになるこのjqueryスニペットがあります：

            var $window = $(window),
            $stickyEl = $('.rightcol'),
            elTop = $stickyEl.offset().top;
            $window.scroll(function() {
              var windowTop = $window.scrollTop();
              $stickyEl.toggleClass('sticky', windowTop > elTop);

        });

CSS：

.rightcol.sticky {
      position: fixed;
      top: 0;
    }

右の列をスクロールすると、一番上に留まりますが、左に移動します。右にあるはずです。スクロールまたはページの読み込みの前に、要素を最初に配置する必要があります。どうすればこの問題を解決できますか。

4

1 に答える 1

0

問題は、スクロール要素をfloat: rightANDに設定していることposition: fixedです。これは、floatと矛盾します。

要素のfloatプロパティを設定すると、ドキュメントの残りの部分に、その要素の周囲に他のコンテンツを収めるように指示することになります。

要素のpositionプロパティをに設定した場合fixed、またはabsoluteドキュメントの通常のフローから要素を削除した場合。これは、要素によって消費されたスペースが考慮されなくなることを意味します。つまり、他の要素に影響を与えることはありません。これは、固定位置に加えてフロートを設定しようとすると、要素のスペースが考慮されないため、ドキュメントの残りの部分が要素の周りを流れないことを意味します。

これらを見てください：

于 2012-10-31T13:29:43.057 に答える