ハンバーガーメニュー
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
[[jQueryめも]]
*メニューが開いている間は背景を固定する [#uc5ddf72]
<style>
.scroll-prevent {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
}
</style>
<script>
// メニューを開いた時
$('html').addClass('scroll-prevent');
// メニューを閉じた時
$('html').removeClass('scroll-prevent');
</script>
*メニューの高さを調整する [#v6b176a9]
<script>
// 読み込み時とリサイズ時に設定
$(window).on('load resize', function(){
// 表示領域の高さを取得して設定
var h = $(window).height();
$('#hamburger_menu').height(h);
});
</script>
終了行:
[[jQueryめも]]
*メニューが開いている間は背景を固定する [#uc5ddf72]
<style>
.scroll-prevent {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
}
</style>
<script>
// メニューを開いた時
$('html').addClass('scroll-prevent');
// メニューを閉じた時
$('html').removeClass('scroll-prevent');
</script>
*メニューの高さを調整する [#v6b176a9]
<script>
// 読み込み時とリサイズ時に設定
$(window).on('load resize', function(){
// 表示領域の高さを取得して設定
var h = $(window).height();
$('#hamburger_menu').height(h);
});
</script>
ページ名: