前端之家收集整理的这篇文章主要介绍了
javascript – 悬停时置于前面(当被其他元素遮挡时),
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我今天早上看了@L_403_0@,并注意到即使一个状态被一个点遮挡,它也会在悬停时被提前.
例如,覆盖马萨诸塞州的点也部分覆盖了新罕布什尔州,但是当你进入新罕布什尔州的覆盖部分时,新罕布什尔州就会被提出来.
你觉得他们怎么做到这一点?点基于它们在DOM中的顺序位于状态轮廓的前面.我认为在所有事情的基础上可能会有第二组状态轮廓,听取会触发底层形状的鼠标悬停,但事实似乎并非如此.
我需要在我正在处理的应用程序中实现类似的功能,并对使用SVG元素的优雅方式感到好奇.
谢谢.
最佳答案
As noted到
Andy那个NYT图形中的圆圈有一个CSS指针 – 事件
属性为none:
circle {
pointer-events: none;
}
使用this method可以在鼠标悬停功能中实现前置行为:
stateShape.on("mouSEOver",function(){this.parentNode.appendChild(this);})