jQueryでスクロールに追随するメニューを実装
よくあるスクロールに追随してメニューの位置を固定して常にメニューが表示されるようにするやつ。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
(function($) { if($('#fixedBox').length){ var nav = $('#fixedBox'), //メニューの高さを変数に offset = nav.offset(); //変数「nav」のオフセット値を格納 $(window).scroll(function(){ if($(window).scrollTop() > offset.top){ //メニューの位置よりスクロール量が多くなったら nav.addClass('fixed'); //メニューのclassに「fixed」を追加 }else{ nav.removeClass('fixed'); //メニューの位置よりスクロール量が小さくなったら削除 } }); } })(jQuery); |
おすすめ記事
コメント
この記事へのトラックバックはありません。
この記事へのコメントはありません。