jquery - Jquery在多个div上淡入淡出

Question

我正在使用脚本来淡入和淡出 div。它在一个上运行良好，但在另一个上根本不行。有谁知道为什么？这是它的小提琴http://jsfiddle.net/MeEc6/

这是 JavaScript：

$(document).ready(function()                         

    {  var book = $('#book');
       var synopsis = $('#synopsis');
function runIt() {
   synopsis.animate({opacity:'+=1'}, 1000);
   synopsis.animate({opacity:'-=0.9'}, 2000, runIt).delay(2000);
}
       runIt();});

Answer 1

据我所知，你想在 and 上做同样的动画book，synopsis但你只包括animate方法 on synopsis：

例子

function runIt() {
   synopsis.animate({opacity:'+=1'}, 1000);
   synopsis.animate({opacity:'-=0.9'}, 2000, runIt).delay(2000);

   book.animate({opacity:'+=1'}, 1000);
   book.animate({opacity:'-=0.9'}, 2000, runIt).delay(2000);
}

Answer 2

为两者添加一个类：http: //jsfiddle.net/MeEc6/3/

<div id="synopsis" class="fader">
    <img src="http://www.unearthingfilm.com/images/interface/shine.png" width="150" height="150" />
</div>
<!-- End of Synopsis -->
<div id="book" class="fader">
    <img src="http://www.unearthingfilm.com/images/bookGlow.png" width="365" height="347" />
</div>

并制作动画：

var synopsis = $('.fader');