2

ページ上部に固定された 2 つの div に問題があります。ページを下または上にスクロールすると、すべて問題ありません。しかし、左右にスクロールすると、2 番目の div が表示されません。どうすれば解決できますか？

これが私のページです。これを行うことで問題を確認できます: 1. ブラウザのページのサイズを変更します 2. 下にスクロールします 3. 右にスクロールします

ここにコード：

 <HEAD>

<script type='text/javascript' src='jquery-1.7.1.js'></script>
</HEAD>
<LINK REL="stylesheet" HREF="Stile.css" TYPE="text/css" />
<BODY>
<script type='text/javascript'>
$(window).load(function(){
$(window).scroll(function () { 
    if(($(".container").position().top - $(window).scrollTop()) <= 0)
       {
           $("#cont").addClass("fixmenu");
       }
       else
       {
           $("#cont").removeClass("fixmenu");

       }
}); }); 
</script>

<div class="container" >

<div id="cont">

<div id="menubar">
</div>
<div id="fastlogin">
</div></div>

4

2 に答える 2

0

小さい画面幅用に別のスタイルシートを設定して、右の div を別の位置に配置できます。

または、ボックスの位置と幅にパーセンテージを使用して、レイアウトを流動的にすることもできます。

right: #%;または、左マージンを設定する代わりに、 を使用して右ボックスを配置することもできます。

または、流動的な幅をその左マージンに設定します。

または、または、または…</p>

于 2012-09-17T13:23:17.847 に答える
0

y 軸のみの位置を固定します。この小さなスクリプトでこれを実現できます。

var topOffset = parseInt($("#header").css('top'));
$(window).scroll(function(){
    $('#header').css({
        'top': $(this).scrollTop() + topOffset
    });
});

デモ

于 2012-09-17T13:39:02.627 に答える