Firefoxではスクロールすると上部に固定されるナビゲーションの挙動がおかしい

Question

###Firefoxでもナビがスクロールで上部に来た際に固定したい

お世話になります。
Webサイトでスクロールすると上部に固定されるナビゲーションを作成しているのですが
Firefoxのみスクロールで上部にくる前に固定されてしまいます。
chromeやsafariでは問題ありません。
scrollTop()の動作でFirefoxでクセがあるというところまでは調べたのですが、
その対処方法が分かりません。
ご存知の方がいらっしゃいましたら
ご教授いただけるとありがたいです。
何卒よろしくお願いいたします。

該当のソースコード

<div>
-
-
-
</div>
<div id="home-nav" class="home-nav">
　<nav>
　　<ul>
　　　<li>〜</li>
　　　<li>〜</li>
　　　<li>〜</li>
　　</ul>
　</nav>
</div>

<script>
//jQuery 読込み
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
//スクロールすると上部に固定されるナビゲーション
jQuery(function() {
　var nav = jQuery( '#home-nav') ;
　//navの位置
　var navTop = nav.offset().top;
　//スクロールするたびに実行
　jQuery( window ).scroll(function () {
　　var winTop = jQuery(this).scrollTop();
　　//スクロール位置がnavの位置より下だったらクラスfixedを追加
　　if ( winTop >= navTop ) {
　　　nav.addClass('homenav-fixed')
　　} else {
　　　nav.removeClass('homenav-fixed')
　　}
　});
});
</script>

/*jQuery 制御 メニュー固定css*/
.homenav-fixed {
	position: fixed;
	width: 100%;
	top: 0;
	background: rgba( 255,255,255,0.9 );
	z-index: 5000;
}

/*メニューcss*/
nav ul {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

クラス homenav-fixed にてCSS制御してますので
jQueryではクラスの制御だけです。

何卒よろしくお願いいたします。

Comments

[x_x]

CSSも記述してください。また、ところどころにある全角スペースはそのまま入っているのでしょうか？

[d-xanthus]

x_x様、ご覧頂きましてありがとうございます。CSSを記述させて頂きました。また所々の全角スペースですが、実際は半角スペースですしクロームやサファリでは正常に動作していますのでとりあえず無視して大丈夫だと考えています。

[x_x]

提示コードのみでは再現しません。何か漏れがあるのではないでしょうか？

[d-xanthus]

前提となるjQueryの読込みコードを記載しました。これで全部だと思いますが…

Answer 1

Firefoxのアップデートで、このエラーは解消されたようです。
閲覧頂きありがとうございました。

Answer 2

動くサンプル：https://jsfiddle.net/rvs7jfhp/

問題が再現しません。
script要素の書いている位置がおかしいので、HTML自体を見直してみてください。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- ↑ script要素の中に入れない！ -->
<script>
//jQuery 読込み
//  削除 削除 削除 削除 削除 削除 削除 削除 削除 削除 削除 削除 削除 削除
//スクロールすると上部に固定されるナビゲーション
jQuery(function() {
　var nav = jQuery( '#home-nav') ;
　//navの位置
　var navTop = nav.offset().top;
　//スクロールするたびに実行
　jQuery( window ).scroll(function () {
　　var winTop = jQuery(this).scrollTop();
　　//スクロール位置がnavの位置より下だったらクラスfixedを追加
　　if ( winTop >= navTop ) {
　　　nav.addClass('homenav-fixed')
　　} else {
　　　nav.removeClass('homenav-fixed')
　　}
　});
});
</script>

Comments

[d-xanthus]

kei344さま、
ご回答頂きましてありがとうございます。また記述ミスをご指摘戴きありがとうございます。
実際はWordPress内封のjQueryを使用しているので、追加記述の際にミスしていたようです。
申し訳ないです。
またFirefoxの直近のアップデートでどうもこの問題が解消されたようで
改めて検証してみると正常に動いていることを確認しました。
お手数をおかけ致しました。
ありがとうございます。