Question

我知道我可以禁用覆盖元素上的指针事件，但是我不想这样做。我希望Covering和Covered元素都能够响应鼠标事件，以便当鼠标指针同时触摸它们时，它们都转换为与悬停选择器相对应的状态。

Answer 1

您可以围绕要跟踪的DOM元素定义一个父容器。 This StackOverflow thread显示了一种简单的方法，其中父级div具有类“节”。它包含两个元素，它们在悬停时都应该有一个边框（从this answer post引出代码段）：

<html>
  <style type="text/css">
    .section { background:#ccc; }
    .layer { background:#ddd; }
    .section:hover img { border:2px solid #333; }
    .section:hover .layer { border:2px solid #F90; }
  </style>
</head>
<body>
  <div class="section">
    <img src="myImage.jpg" />
    <div class="layer">Lorem Ipsum</div>
  </div>
</body>
</html>

如果被另一个元素覆盖，则响应CSS悬停选择器

1 个答案: