スクロールしてもメニューが固定されるようJavaScriptとCSSでなんとかする／改訂

Cocoon

簡単だなあと感心していたclingify.jsによるナビメニューの固定だったが、Cocoonの構成とブラウザーとの相性（？）があるようで別の方法を探すことになった。

clingify.jsを使ってメニューを固定してみたけれど...
スクロールとともに消えてしまうメニューが残念なのでなんとかしたい。 簡単に要素を固定できる clingify.js を使う。 ① CSSを読み込む head-insert.php <link rel="st...
nnland.net
2019.05.27

fifefoxではサブメニューも正常表示されるのだけれど、chromeもエッジもサブメニューが隠れてしまう。

javascript.js

$(function($) {
	var nav = $('#navi'),
	offset = nav.offset();
	$(window).scroll(function () {
		if($(window).scrollTop() > offset.top) {
			nav.addClass('naviFixed');
		} else {
			nav.removeClass('naviFixed');
		}
	});
});

style.css

/*ナビメニュー固定*/
.naviFixed {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 999;
}

今のところ、これでいけている。