javascript - 使用 css :hover declaration 选择元素

Question

我没有在网上找到任何答案，所以可能有人可以帮助我。

例如，如果我们有下一个 CSS 声明:

.hot_imgs li .detail{position:absolute;left:0;top:0;display:none;width:190px;height:190px;padding:0 40px;color:#fff;font-size:16px;font-family:"Microsoft YaHei","\5fae\8f6f\96c5\9ed1","\5b8b\4f53"}
    .hot_imgs li .detail h3{margin-top:75px}
    .hot_imgs li a:hover .img_bg,.hot_imgs li a:hover .detail{display:block} 

和给定的元素:

<div class="hot_imgs">
    <li id="711F">
      <a href="#">
        <img src="www.fishki.com" alt="Young" width="270" height="190">
        <span class="img_bg"></span>
        <div class="detail">
          <h3>Young</h3>
        </div>
      </a>
    </li>
<div>

从 CSS 声明中我们可以看出，当带有 hot_imgs 类的 div 中的列表链接悬停时，该 div 将被另一个带有 details 类的 div 覆盖。

我想使用 jQuery 来识别哪些元素可能具有在滚动时触发的“:hover”属性，而无需任何鼠标交互。

非常感谢

Answer 1

你不能定位伪元素本身，所以如果你打算为此使用 jquery，它内置了悬停的东西。你需要知道你想要检查哪些元素悬停，例如，如果你想检查你可以做的形象。

$(".hot_imgs img").hover(function(){
  //your logic here
});

只是一个旁注 - 所有元素都可以有':hover'，所以你需要使用 jquery 来定位。因此，没有什么可以检查哪些元素“可能”具有 :hover，因为它是一个伪选择器/类。

这是这个例子的 fiddle - http://jsfiddle.net/W4Km8/5413/