javascript - 如何申请:hover to an element

Question

我想通过悬停在不同的对象上来远程应用悬停状态。但我想命名已激活其悬停的对象，而不是通过与悬停在其上的项目的 DOM 关系来命名。

<style>
img:hover {border: thin red solid;}
</style>

<li id="hover-over-me">Dogs</li>
<img src="dog.jpg" />

我还没有找到允许您将悬停伪类效果远程应用于元素的 javascript 或 jquery 方法(即独立于实际悬停的元素)。有办法做到这一点吗？

Answer 1

http://sandbox.phpcode.eu/g/3304b

<style> 
img:hover,img.hovered {border: 5px red solid;} 
</style> 
<ul>
   <li id="hover-over-me">Dogs</li>
</ul> 
<img src="http://4.bp.blogspot.com/_7VyEDKFMA2U/TOX9ZL7KRPI/AAAAAAAAACM/-XSoYjePBPk/s1600/cute-puppy-dog-wallpapers.jpg" /> 
<script> 
$("li").mouseenter(function(){ 
   $("img").addClass('hovered'); 
}); 

$("li").mouseout(function(){ 
   $("img").removeClass('hovered'); 
}); 


</script>