jQuery淡入淡出图像，但鼠标悬停在图像上

Question

<!DOCTYPE html> 
<html> 
<head> 
    <script>
       $(".playThumb").fadeTo("normal", 1);

        $(".playThumb").hover(function() {
                      $(".playThumb").not($(this)).fadeTo("fast", 0.3); },
      function() {
                      $(".playThumb").not($(this)).fadeTo("fast", 1);
                 });
         </script>

<body> 
<a href="#"><img src="artistry.png" class="playThumb" />
<a href="#"><img src="flavour.png" class="playThumb" />
<a href="#"><img src="quality.png" class="playThumb" />
<a href="#"><img src="Style.png" class="playThumb" />
</body> 
</html>

The images appear but nothing happens, whenever the mouse on the image other images it doesnt fade. 图像出现但什么也没有发生，只要鼠标在图像上其他图像不褪色。

Answer 1

following code works for me 以下代码对我有用

  $(document).ready(function () {

            $(".playThumb").hover(function () {
                $(".playThumb").not($(this)).fadeTo("fast", 0.3);
            }, function () {
                $(".playThumb").not($(this)).fadeTo("fast", 1);
            })
   });

Answer 2

使用.mouseover（）事件并尝试

Answer 3

Include jQuery library in the <head> section. 在<head>部分中包括jQuery库。

Add your JS code in DOM ready function. 在DOM ready函数中添加您的JS代码。

 <script> $(document).ready(function(){ $(".playThumb").fadeTo("normal", 1); $(".playThumb").hover(function() { $(".playThumb").not($(this)).fadeTo("fast", 0.3); }, function() { $(".playThumb").not($(this)).fadeTo("fast", 1); }); }); </script>

Your HTML does not have ending </head> tag. 您的HTML没有结尾</head>标记。

jQuery淡入淡出图像，但鼠标悬停在图像上

问题描述

3 个解决方案

解决方案1
1 2015-03-27 06:48:26

解决方案2
0 2015-03-27 06:39:39

解决方案3
0 已采纳 2015-03-27 06:53:22

jQuery淡入淡出图像，但鼠标悬停在图像上

问题描述

3 个解决方案

解决方案1 1 2015-03-27 06:48:26

解决方案2 0 2015-03-27 06:39:39

解决方案3 0 已采纳 2015-03-27 06:53:22

解决方案1
1 2015-03-27 06:48:26

解决方案2
0 2015-03-27 06:39:39

解决方案3
0 已采纳 2015-03-27 06:53:22