jQuery模糊悬停效果问题

我再次遇到jQuery问题，希望有人能帮助我。jQuery模糊悬停效果问题

请点击这里查看http://matoweb.com投资组合部分（应该有两个项目）

我重新设计我的投资组合的网站，我想列出与模糊悬停效果最后6个投资组合项目。我设法得到这个工作有一个图像（第二个，这是真正的第一篇文章），但现在我又增加了测试产品系列项目，有两个问题：

我只得到了第一个帖子的模糊图像（第二图像），第二支柱的形象没有得到它自己的模糊版本图像
第二个问题是，当我将鼠标悬停在一个图像会触发动画的第二个，也是

这里这些效果的代码，但您可以查看它在网站上的行动：

 $(window).load(function(){ 
      $(".img_portfolio").pixastic("blurfast", {amount:1}); 
     }); 

     $(function() { 
      $(".prva_stran_portfolio_single").mouseenter(function() { 
       $(".normal_image").fadeOut("fast"); 
      }).mouseleave (function() { 
       $(".normal_image").fadeIn("fast"); 
      }); 
     }); 
     $(function() { 
     $(".roll").css("opacity","0"); 

     $(".roll").hover(function() { 

     $(this).stop().animate({ 
     opacity: 0.9 
     }, "fast"); 
     }, 

     function() { 

     $(this).stop().animate({ 
     opacity: 0 
     }, "fast"); 
     }); 
     });

任何帮助将真正appartiatied球员。

我怎么可以添加某种形式的ID给图像，这样当它们只悬停在其中一个上时，它们不会全都模糊？

来源

2012-09-15 matejlatin

你想模糊？或者你只是试图使用不透明效果？ – kaigth

而不是只是一个悬停，我会使用每个（功能），让他们都分开。他们不应该在不同的功能，真的......保持事情更清洁，更容易调试这种方式。

$(".prva_stran_portfolio_single").each(function(){ 
    $(this).hover(function(){ 
     Run everything that happens on a hover (mouse in) here. 
    },{ 
     Run everything that happens on a hover (mouse out) here. 
    }); 
});

来源

2012-09-15 21:12:56

你并不需要使用一个ID，你应该能够调用.find("normal_image")这将搜索所有的子孙元素。相反，您可以使用.closest()来搜索所有祖先元素以找到最接近的匹配元素。

我不确定pixastic为什么不为两幅图像创建模糊画布，我的建议是尝试使用.each(function() { pixastic(blur) })与选择器。

来源

2012-09-15 21:16:44

感谢您的帮助，但它似乎并没有工作......我想我必须忘记悬停效果模糊。 – matejlatin

这是一个干净而简单的方法来完成你想要的。

var blurredImages = $('.blur-me'); 

blurredImages.on("mouseenter", function() { 
    $(this).addClass("blurred"); 
}) 

blurredImages.on("mouseleave", function() { 
    $(this).removeClass("blurred"); 
})

此外，我建议使用CSS3转换，而不是jQuery动画为转换计时。它快得多。我把它包括在小提琴中。

这里是一个jsfiddle：http://jsfiddle.net/4mE3b/

来源

2013-10-26 05:23:40 kaigth

jQuery模糊悬停效果问题

回答

相关问题