0

位置が固定されているdivがあります。ウィンドウのサイズが変更されるまで、すべて問題ありません。サイズ変更時に、Webページの右端までスクロールしても、固定divは画面の左端に残ります。ウィンドウと一緒に左にスクロールしたいのですが、ウィンドウと一緒に下にスクロールしないでください。

疑問を表明するのが不明確な場合。ここでライブデモを行うことができます。

そこにある製品を検索しますApple Ipod Touch。結果が表示されたら、ウィンドウのサイズを変更し、右端までスクロールします。

誰かが同じことを解決するためにCSSまたはJavascriptを提案できますか?

ありがとう !

4

3 に答える 3

1

レイアウトを再構築し、固定位置を削除します。たとえば、このようなものです。明らかに、これはあなたのコードとまったく同じではありません。しかし、コンセプトは同じです。結果と履歴と同じコンテナー内にコントロールを含む div がある場合は、それと共に移動する必要があります。

#wrapper {
width:960px;
margin:0 auto 0 auto;
}

#left-col,
#right-col {
width:100px;
float:left;
}

#mid-col {
width:710px;
float:left;
}

<!-- holds your column containers -->
<div id="wrapper">

<!-- your control -->
<div id="left-col"> 
</div>

<!-- your search results -->
<div id="mid-col"> 
</div>

<!-- your history -->
<div id="right-col"> 
</div>

</div>
于 2012-04-04T19:23:56.323 に答える
0

CSSメディアクエリまたはJavascriptを使用します。手っ取り早い方法は、Jquery $(window).resizeメソッドです。

于 2012-04-04T19:07:51.460 に答える
0

外すしかないと思う

position: fixedから#completeSlider

少なくともそれはクロムで私にとってはうまくいきました。

編集:

その場合、これを処理するには JQuery を使用する必要があると思います。固定された配置と他の要素に対する相対的な配置の両方を持つことはできません。position: fixed上記のように削除し、次のような JQuery マジックを追加します。

$(window).scroll(function() {

$('#completeSlider').offset({ top: $(window).scrollTop(), left: 0});

});

jQueryの標準$は、ページ上の他の機能のために予約されているようです...これを試してください:

jQuery(window).scroll(function() {

    jQuery('#completeSlider').offset({ top: jQuery(window).scrollTop(), left: 0});

});
于 2012-04-04T19:10:45.217 に答える