Question

好的，所以我有一个嵌套的div，它充满了文本（overflow：auto）。父div具有（overflow：hidden），并且通过这个技巧，我可以使用具有负右偏移的绝对定位进行滚动。这两个div位于我的网页右半部分的中心容器中。

我想使用悬停为这些嵌套的div实现滚动系统。当用户悬停嵌套div的较低25％（红色部分）时，内容向下滚动。当用户悬停div的上部25％（蓝色部分）时，内容会向上滚动。

我一直在努力找出实现这一目标的最佳方法。我尝试使用z-index和绝对定位来在div之后使用正确的％比例来堆叠div，但是我不能让jQuery认识到它在这些div之上盘旋，因为它们位于内容之后。下面的屏幕截图显示了我网页的右侧。

http://i60.tinypic.com/2qw28vp.png

有没有办法做到这一点类似于图像映射，指定＆＃34;区域＆＃34; div在触发悬停时的文本滚动等事件？

Answer 1

您可以避免在文本顶部创建空div，而是听取jQuery的mousemove事件并检测clientY鼠标位置。

$('.container').mousemove(function (e) {
    if (e.clientY < $('.container').height() / 2) {
        scrollText('up')
    } else {
        scrollText('down')
    }
});

http://jsfiddle.net/3hj9vfcr/

在hover / mouseover div的某个区域执行jQuery函数

1 个答案: