用途
新着
履歴
言語



  • GoogleAppsScript
  • Git

jQeury スクロールでヘッダー表示

jQeury スクロールでヘッダー表示
jQeury スクロールでヘッダー表示
jQueryの応用で一定のピクセル数スクロールするとヘッダーが表示されるサンプルです。

以下のサンプルでは、70px以上スクロールすると、ヘッダーの要素がスライドして覆いかぶさります。

ファーストビューでは必要ないが、ページ下部になると必要性が高い要素を表示する時に重宝します。

$(document).ready(function(){
	fixed_menu = 0;
	$(window).scroll(function(){
		if( $(this).scrollTop() > 70 ){
			if(fixed_menu==0){
				$('#headerwrap_fixed').slideDown(400);
				fixed_menu=1;
			}
		} else {
			if(fixed_menu){
				$('#headerwrap_fixed').slideUp(200);
				fixed_menu=0;
			}
		}
	});
});

以下のリンク先にサンプルがあります。

2019-08-04 16:09:24
LINEでシェア
このページの二次元コード

関連するサンプル

search -  category -  about
© 2019 kipure
Top