IE11でのjQueryの挙動について

Question

前提・実現したいこと

「jQueryで作る、下にスクロールで消えて、上にスクロールで現れる固定メニュー」
http://weboook.blog22.fc2.com/?no=412
【デモ】http://js.crap.jp/book/chapter5/scroll-up-down.html

こちらを参考にコーディングしているんですが、
Internet Explorer 11だと
スクロール中はメニューが消えますが
スクロールが止まるとメニューが表示されてしまいます。
※jQueryは1.11.3を使用

正確には、スクロールバーをクリックドラッグだと消えたままで、
マウスホイールでのスクロール時に挙動がおかしくなります。

Firefox, Google Chrome、IE10だと問題無いのですが、
どのようにすればIE11でもきちんとメニューが消えたままになるのでしょうか？
よろしくお願いします。

該当のソースコード

【JavaScript】

$(function() {
var menuHeight = $(".navbar-fixed-top").height();
var navPos = 0;
$(window).scroll(function () {
var Pos = $(this).scrollTop();
if (Pos > navPos) {
if ($(window).scrollTop() >= 100) {
$(".navbar-fixed-top").css("top", "-" + menuHeight + "px");
}
} else {
$(".navbar-fixed-top").css("top", "0px");
}
navPos = Pos;
});
});

Comments

[退会済みユーザー]

レイアウトエンジンの特性のような（多分 EDGEでも IE11と同じ動きをすると思う）

[退会済みユーザー]

参考サイトもIE11 すててるな・・・

[crz]

EDGEだと問題無い挙動でした。

Answer 1

そのサイトのコメント欄にもありますが、

  } else if (startPos > currentPos) {
    $("#menu-wrap").css("top", 0 + "px");
  }

else ifで条件指定したらIE11でも正常動作するようになりました。

Comments

[crz]

ありがとうございます。
該当サイトのコメント欄にもヒントがあったんですが、
どのように書けば良いのか今一つよく分からず。。
お陰で解決できました！ありがとうございました。

[crz]

var menuHeight = $(".navbar-fixed-top").height();
var startPos = 0;
$(window).scroll(function(){
var currentPos = $(this).scrollTop();
if (currentPos > startPos) {
if($(window).scrollTop() >= 200) {
$(".navbar-fixed-top").css("top", "-" + menuHeight + "px");
}
} else if (startPos > currentPos) {
$(".navbar-fixed-top").css("top", 0 + "px");
}
startPos = currentPos;
});