Question

代码示例：

<body>
    <div id="something" style="width: 50vw; height: 300px;">
        </div>
    <div class="else">oekdoekod</div>
</body>

问题是我只需要在悬停身体时使用光标指针效果，而不是将div与id="something"一起悬停。

它不起作用

:not(#something) {
    cursor: pointer;
}

但

$(document.body).on("hover", ":not(#something, #something *)",function(e){ 
   $(this).addClass("pointer"); 
     e.stopPropagation(); 
});

用css

.pointer {
    cursor: pointer;
}

它有效但仅限于其他元素，例如.else

如何pointer光标仅在hover身上而不是#something身上应用{{1}}个事件？

Answer 1

这对我有用，你在用什么浏览器测试？这是JSBin。

<强> CSS

body{
  cursor:crosshair;

}

#something {
  width: 50vw;
  height: 300px;
  background-color:rgba(0,0,255,.2);
  cursor:pointer;
}

#else{
  width: 50vw;
  height: 300px;
  background-color:rgba(0,255,255,.2);
}

<强> HTML

<div id="something"></div>
<div id="else"></div>

Answer 2

根据你的描述在主体上有一个指针光标而不是#something，这应该可以解决问题：

body {
    cursor: pointer;
}
#something {
    cursor: auto;
}

将悬停事件（光标指针属性）添加到正文但不添加到其子对象

2 个答案: