Javascript Jquery悬停但未处于活动状态

我写了一段代码，让我的垂直导航在图像上有一个小的淡入/淡出悬停效果。唯一的问题是我不能让活跃分子什么都不做

我只希望图像在导航时淡入淡出，但在活动时保持100%不透明度，而在悬停时不设置动画。下面代码的问题是，即使它们不处于活动状态，它们也会设置动画

现在我不是jquery专家，但这是我想学习的东西，所以任何帮助都将不胜感激

      if (!$(".view-sidebar-links .views-row a").hasClass("active")) {
                $(".view-sidebar-links .views-row").hover(
                    function() {
                    $("img", this).fadeTo("fast", 1);;
                },
                function() {
                    $("img", this).fadeTo("fast", 0.33);;
    });
  };

html

     <div class="view-content">

       <div class="views-row views-row-1 views-row-odd views-row-first">
        <h2 class="title"><a href="/alpiniainstitute/about/clinical-devlopment">Clinical devlopment</a></h2>    
        <a href="/alpiniainstitute/about/clinical-devlopment"><img typeof="foaf:Image" src="http://localhost/alpiniainstitute/sites/default/files/styles/sidebar_links/public/images/slideshow/image01.jpg" /></a>
      </div>

      <div class="views-row views-row-2 views-row-even">
       <h2 class="title"><a href="/alpiniainstitute/about/technological-development">Technological development</a></h2>    
       <a href="/alpiniainstitute/about/technological-development"><img typeof="foaf:Image" src="http://localhost/alpiniainstitute/sites/default/files/styles/sidebar_links/public/images/header-images/Screen%20shot%202012-05-11%20at%2010.05.30.png" /></a>
      </div>

      <div class="views-row views-row-3 views-row-odd views-row-last">
       <h2 class="title"><a href="/alpiniainstitute/team" class="active">Our Team</a></h2>    
       <a href="/alpiniainstitute/team" class="active"><img typeof="foaf:Image" src="http://localhost/alpiniainstitute/sites/default/files/styles/sidebar_links/public/images/header-images/team-header-image.jpg" /></a>    
      </div>

    </div>

---

我已经设法让它工作，现在你可以看到上面的代码对页面上的所有图像都有效。如果我添加（'img'，this），它就不起作用了？

您可以尝试在Jquery中使用.not（'selector'）

更新：请尝试以下操作：

$(".views-row").delegate("a:not(.active)", "mouseenter", function() {
  $(this).find('img').fadeTo('fast', 1);
}).delegate("a:not(.active)", "mouseleave", function() {
  $(this).find('img').fadeTo('fast', 0.33);
}); 

---

你的逻辑有点不正确。您正在条件中设置事件处理程序，而不是反过来设置（即，在事件处理程序中检查条件）

另外，请尝试委托：

$('.views-row')
    .on('mouseover', 'a:not(.active)', function () {
        $('img', this).fadeTo('fast', 1);
    })
    .on('mouseout', 'a:not(.active)', function () {
        $('img', this).fadeTo('fast', 0.33);
    });

---

这样，如果您的视图行打开/关闭它们的

活动
类，您仍然可以动态地检查是否运行处理程序，同时还可以最大限度地减少您在DOM上实际发出的事件处理程序的数量。
谢谢，但在参数列表之后，我收到一条错误消息（丢失）。我把）放进去，然后它说.on不是一个函数。
.on（）
仅适用于jQuery 1.7+（我建议您还是使用它）。如果您一直使用较低版本，请查看
delegate（）
，这基本上是旧版本的等效版本。好的，我来试试。我正在使用Drupal7构建我的站点，即使使用jquery更新模块，也只会将它带到jquery 1.5.2。因此，我将尝试委托，看看是否能想出一个解决方案。这会使链接悬停，图像发生变化，但活动的仍会有动画。当我在$（“.views侧边栏links.views行a”）中进一步缩小它的范围时，它就不起作用了。因为.not（'.active'）在.views行上，所以上面的代码在活动类上不起作用，对吗？
$('.views-row')
    .on('mouseover', 'a:not(.active)', function () {
        $('img', this).fadeTo('fast', 1);
    })
    .on('mouseout', 'a:not(.active)', function () {
        $('img', this).fadeTo('fast', 0.33);
    });