我的页面顶部有一个菜单栏，如果我已经在顶部向上滚动，我想显示它。想象一下你向上滚动，当你在那里时，你再次向上滚动，栏就会显示出来。
我有这个代码使用 jquery
// listen for the scroll to show the top menu
var was_on_top = false;
$(function () {
$(window).bind("scroll", function (e) {
if ($(window).scrollTop() == 0) {
if ($('.menu').css('display') == "none" && was_on_top) {
$('.menu').slideDown();
} else {
was_on_top = true;
}
} else {
was_on_top = false;
}
});
});
但是滚动事件在已经位于顶部时不会触发。有任何想法吗？
编辑：这是工作代码。在 FF、Chrome 和 IE9 上测试
// listen for the scroll to show the top menu
var was_on_top = false;
$(function () {
if (window.addEventListener) {
window.addEventListener('DOMMouseScroll', onMouseWheelSpin, false); // FireFox
window.addEventListener('mousewheel', onMouseWheelSpin, false); // Chrome
} else {
window.onmousewheel = onMouseWheelSpin;
}
});
function onMouseWheelSpin(event) {
if (!event) // IE sucks
event = window.event;
if ($(window).scrollTop() == 0 &&
(
event.detail < 0 // Firefox
||
(event.wheelDelta && (
(window.opera && event.wheelDelta < 0) // Opera
||
event.wheelDelta > 0 // IE
)
)
)
) {
if ($('.menu').css('display') == "none" && was_on_top) {
$('.menu').slideDown();
} else {
was_on_top = true;
}
} else {
was_on_top = false;
}
}