繁体   English   中英

jQuery淡出MouseOver通过Div中的多个图像淡出

[英]jQuery Fade In Fade Out On MouseOver Via Multiple Images In A Div

所以我正在设计一个网站,我希望能够通过一个名为XHTML 1.0的图像来获得每个公司的徽标。在鼠标悬停时淡入淡出并在不再鼠标悬停时淡出。 我安装了jQuery,什么不安装,我只是不知道每个图像或单独一个图像的代码。 我不懂JavaScript和/或jQuery。

非常感谢你对Aaron Brewer的未来答案(以及可能的解释)

每个图像都需要一个容器,否则在图像淡出时没有元素可以触发鼠标。

HTML

<div class="img-container">
   <img src="a.jpg" alt="a" />
</div>

<div class="img-container">
   <img src="b.jpg" alt="b" />
</div>

<div class="img-container">
   <img src="c.jpg" alt="c" />
</div>

jQuery的

$('.img-container').each(function() {

   // Get a reference to the image.    
   var img = $(this).find('img');

   // Hide by default.
   img.hide();

   $(this).hover(function() {
       img.stop().fadeIn(500);
   }, function() {
       img.stop().fadeOut(500);
   });

});

也许这个小小的现场演示会让你朝着正确的方向前进,因为它使用CSS3和jquery进行淡入淡出,所以如果一个失败,另一个可以接管。 http://jsfiddle.net/robx/jrnFj/2/

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM