css 将光标悬停在父div内时将div附加到光标

of1yzvn4  于 2022-11-26  发布在  其他
关注(0)|答案(1)|浏览(126)

我有一个滑块图库(使用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工作与所有画廊细胞将不胜感激。

qpgpyjmq

qpgpyjmq1#

这就像您所要求的那样,您需要将事件侦听器添加到所有具有.gallery-cell类的元素中,并记住获取悬停在其中的元素的偏移量,以便在适当的点(即,如果您已经滚动)显示文本。
你用jquery标记了这个问题,所以我用了它,因为它更简单。
第一个

相关问题