如何使用 jQuery 使图像在悬停时淡出

Question

我尝试一遍又一遍地查看我的代码，以使八角图像在鼠标悬停时褪色，但没有运气。这是一个新手问题，但想知道是否有比我更伟大的人可以偷看一眼。

这是我的代码：https://jsfiddle.net/bennett_up/rybc238w/

$('#octo').hover(function(){  
$(this).find('img').stop().fadeTo('slow', 0);},  
function(){  
$(this).find('img').stop().fadeTo('slow', 1);  
});  

谢谢本

Answer 1

在小提琴中，我看到图像本身是"#octo"而不是它的子级，因此您不需要 .find（'img'），如下所示：

$('#octo').hover(function(){  
   $(this).stop().fadeTo('slow', 0);  
},  
function(){  
  $(this).stop().fadeTo('slow', 1);  
});  

供参考的网页：

<ul id="contact">
    <li><img id="octo" src="http://s.icons8.com/wp-content/uploads/2014/01/octopus-128.png" width="28" height="28"></li>
</ul>

这是一个工作小提琴：

https://jsfiddle.net/d6t0waoj/

Answer 2

删除.find('img')，因为$(this)已经引用了图像元素。

Answer 3

试试这个

    $('#octo').hover(function(){  
      $(this).stop().fadeTo('slow', 0); },  
   function(){  
      $(this).stop().fadeTo('slow', 1);  
   }); 

这将解决您的问题