グローバルメニューなどをスクロール途中で固定する方法 | blog – NOBORU HIRABAYASHI
グローバルメニューなどをスクロール途中で固定する方法。 デモ：グローバルメニューなどをスクロール途中で固定する方法 ポイント このデモではJQueryを使用 最初にnavエリアのY軸座標を取得 navのY座標分スクロールが進んだらnavにposition:fixed;を突っ込む 戻ってきてY座標よりスクロール幅が減ったらposition:staticを突っ込み戻す javascript部分は以下の通り $(function(){ var nav = $('#nav_global'), navAfter = nav.next(), navHeight = nav.height(); var navY = nav.offset().top; $(window).scroll(function(){ var windowTop = $(window).scrollTop(); if(navY <
ページ途中にあるグローバルナビなどをスクロール時にトップに固定するjQuery - ホームページ制作やリニューアル印刷物デザインなら大阪のWPC
ページ途中にあるグローバルナビなどをスクロール時にトップに固定するjQuery タグを指定して、ページ途中にある要素がスクロールしてトップの位置に来た時に固定するjqueryを紹介します。 ページ最上部を固定するならposition:fixed;でも対応できると思いますが、それ以外の中段にある要素（タグ）で固定したい場合に使ってみてはいかがでしょうか。 今回ご紹介するのは、○○PXスクロールしたらという物ではなく、この要素の位置に来たら固定するというものです。 応用すれば、サイドバーなども固定出来ますので、使い勝手は良いと思います。 まず、CSSとjQuery本体を読み込ませ、スクリプトを記述します。 （今回はグローバルナビで説明） HTML記述例（HEAD部） <html> <head> ・ ・ <link href="style.css" type="text/css" rel="st
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
