jq实现鼠标往下滚动页面,导航消失,往上滚动页面,导航显示。
时间:2023-08-09 来源:本站
如何用JQ实现:鼠标往下滚动页面,导航消失,往上滚动页面,导航显示。
废话不多说,直接上代码:
<script>
$(function() {
$(document).on("mousewheel DOMMouseScroll", function (e) {
var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
(e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1)); // firefox
if (delta > 0) {
$("#top").removeClass("d-none"); // 向上滚,这里的代码自己定义,我提供的只是一个演示。
} else if (delta < 0) {
$("#top").addClass("d-none"); // 向下滚,这里的代码自己定义,我提供的只是一个演示。
}
});
})
</script>