3

問題のあるページは次のとおりです: Link。

ピンクの背景に POLL と書かれた右側のサイドバーを見てください。そのサイドバーは現在、固定のフローティング div として下にスクロールします。それはいいです。

問題は、スクロールによって に入るときに幅が変わることposition:fixedです。背景色を黄色に変更したので、それが起こっていることがわかります。明らかに、私は幅を維持したい。

これはレスポンシブ サイトであるため、ピクセル幅はオプションではありません。

それを制御する CSS は次のとおりです。

#comment {
position: relative;
top: 0;
background:pink;
}

#comment.fixed {
position: fixed;
width:inherit;
top: 0;
background:yellow;
}

私を悩ませwidthているものを解決するために、何かをするか、何もしませんinherit。100%

固定 div を制御する jquery コードは、ソースの 50 行目にあります。また、Poll 領域全体は、ソースの 339 行目から始まります。それがさらに役立つ場合。

position:fixedプロパティが、相対的な親ではなくビューポートの値を継承するようになることを理解しています。しかし、解決策があると思います...追加のjavascriptまたはjqueryを使用して動作させる必要があるかどうかは気にしません。

ありがとう。

4

1 に答える 1

2

次のように CSS を動的に設定できます。

var newWidth = $('#comment').parent().width();
$('#comment').width(newWidth);

次に、クラスを削除するときにfixed、その行を追加するだけです:

$('#comment').removeAttr('style');
于 2013-05-23T23:44:34.060 に答える