我要做的是使页面导航按钮隐藏在页面下方,以便在鼠标悬停在屏幕底部三分之一处时向上滑动。
我曾尝试通过在页面底部制作一个固定的、不可见的 div 来做到这一点,然后每当鼠标悬停在该 div 上时,就会出现分页。但是,出现了一个问题。因为 div 覆盖了它下面的文本,所以你不能点击那个 div 下的链接。
那么还有另一种方法来实现我的意图吗?也许通过jquery使用鼠标的y坐标而不是在页面上使用div?谢谢。
我摆脱了 div 而是将其放入我的 jquery 文件中。
$(window).mousemove(function(e) {
var mouseY = e.pageY - $(window).scrollTop(); // mouse y coordinate relative to window
if (mouseY > 500) {
$('#pagination').show().stop().transition( {y:-80}, 500, 'snap'); // slide pagination up
} else {
$('#pagination').stop().transition( {y:+80}, 1000, 'snap'); // slide pagination down
}
});
注意:我使用http://ricostacruz.com/jquery.transit/进行转换
您尝试的解决方案将起作用 - 只需添加
pointer-events:none;
到固定div的css!:)