Question

我要做的是当鼠标悬停在屏幕的底部三分之一处时，将页面导航按钮隐藏在页面下方，以便向上滑动。

我曾经尝试过在页面底部制作一个固定的，不可见的div，然后只要鼠标悬停在该div上，就会出现分页。但是，有一个问题。因为div覆盖了它下面的文本，所以不能单击该div下的链接。

那么有另一种方法来实现我的意图吗？也许通过jquery而不是在页面上使用div来使用鼠标的y坐标？感谢。

Answer 1

我摆脱了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/进行了转化

Answer 2

您尝试的解决方案将起作用 - 只需添加

即可

pointer-events:none;

到固定div的CSS！：）

当鼠标悬停在屏幕底部时，如何显示隐藏的div？

2 个答案: