我有一个滑块图库(使用flickity),有X个图库单元格(div)。在每个div中,有一个图像和一个视频,在悬停时显示。还有一些文本,只有在悬停时才显示。我想让文本在悬停在图库div中时粘在光标上。
我已经能够将文本粘贴到第一个图库单元格上的光标上,但它在其余单元格上不起作用。为每个单元格添加新的JS代码不是好代码。
请参阅小提琴:https://jsfiddle.net/jxnw4pe0/
这是我的JS:
var mydiv1=document.getElementById("myDiv1");
document.addEventListener('mousemove', function (e) {
var x = e.pageX;
var y = e.pageY;
mydiv1.style.top = y + 'px';
mydiv1.style.left = x + 'px';
});
任何帮助,使这个JS工作与所有画廊细胞将不胜感激。
1条答案
按热度按时间qpgpyjmq1#
这就像您所要求的那样,您需要将事件侦听器添加到所有具有
.gallery-cell
类的元素中,并记住获取悬停在其中的元素的偏移量,以便在适当的点(即,如果您已经滚动)显示文本。你用jquery标记了这个问题,所以我用了它,因为它更简单。
第一个