1

画面を上下にスクロールしても垂直に固定されるメニュー バーを作成したいのですが、ユーザーが左右にスクロールすると、残りのコンテンツと共にメニュー バーが左右に移動するようにします。

たとえば、ユーザーがホームページにいて、下にスクロールしてお知らせを読むことにした場合です。左側のメニュー バーをそのままにしておきたいと思います。しかし、ユーザーがウェブページをズームアップして、ページ全体が画面に収まらないとしましょう。ユーザーがページの右側までスクロールすることにした場合、ページの一番左側にある他のコンテンツと一緒にメニュー バーを非表示にする必要があります。

cssだけでこれを行う方法はありますか？ ここに画像の説明を入力

4

1 に答える 1

4

I had a similar problem and I found some help and did some customizations for my own need. Check my code below:

CSS

#sidebar {
  top:70px; // make it for your own
  left: 0px; //make it for your own
  position: absolute;
}

jQuery

var leftOffset = parseInt($("#sidebar").css('left'));

$(window).scroll(function() {

  $("sidebar").css({

    'left': $(this).scrollLeft + leftOffset
  })
});
于 2012-11-20T06:18:18.683 に答える