如何避免在绝对定位的表兄弟div上突出显示所有文本

时间:2016-11-22 01:18:31

标签: javascript jquery html css text

我遇到文字突出显示问题,

段落顶部有一个div cover绝对位置。在DOM结构中,他们是表兄弟。

当突出显示下面的段落文本时,一旦光标悬停在封面上,整个段落会自动突出显示,如何停止?

text selection before the cover:

mouse enters the cover all text gets selected

JS小提琴: https://jsfiddle.net/toplay3/c741LoLv/

#cover{
  position:absolute;
  top:10px;
  left:50px;
  height:100px;
  width:100px;
  background-color:green;
  /*-webkit-user-select: none;*/
}

由于某些原因谷歌幻灯片能够避免使用svg,无论如何在html中做到这一点?

1 个答案:

答案 0 :(得分:2)

您可以使用

pointer-events: none;
<{1}}元素

上的

https://jsfiddle.net/c741LoLv/2/

这将从元素中删除正常的指针功能 - 高亮,悬停,焦点等。

  

CSS属性指针事件允许作者控制特定图形元素在什么情况下(如果有的话)成为鼠标事件的目标。

https://developer.mozilla.org/en/docs/Web/CSS/pointer-events

https://css-tricks.com/almanac/properties/p/pointer-events/