Jquery Cycle 和 Pixastic 快速模糊

Question

我正在尝试循环我的图像并模糊背景图像，但问题是它只模糊了第一张图像而不是下一张图像。

<div id="banner_images">        
    <div id="banner_cycle_wrapper">
        <div id="banner_bg_cycle">
            <img src="source.png" class="blur">
        </div>
        <div id="banner_cycle_container">
            <img src="source.png">
        </div>
    </div>
    <div id="banner_cycle_wrapper" >
        <div id="banner_bg_cycle">
            <img alt="" src="source.png" class="blur">
        </div>
        <div id="banner_cycle_container">
            <img src="source.png">
        </div>
    </div>
</div>

$('#banner_images').cycle({
    fx: 'fade',
    timeout: 2000
});

$(".blur").pixastic("blurfast", {amount:0.5});

Answer 1

我认为您缺少要添加的类

 class="blur"

这应该添加到您想要具有相同效果的每个图像中。

更新代码：

<div id="banner_images"> 
   <div id="banner_cycle_wrapper"> 
      <div id="banner_bg_cycle"> 
         <img alt="" src="source.png"/> 
      </div> 
      <div id="banner_cycle_container"> 
         <img alt="" src="img1.png" class="blur" /> 
         <img alt="" src="img2.png" class="blur" /> 
      </div> 
   </div> 
 </div>

我希望这会有所帮助:)