Jquery循环插件 - Hover / Mouseout幻灯片

时间:2012-10-01 15:51:12

标签: jquery html css

我在jquery循环幻灯片中有一个透明的png。在翻转时,它从图像A淡化为B.在鼠标输出时,它会返回到A.但是,之后的任何翻转都不会重复此淡入淡出。有什么想法吗? 谢谢

    <script type="text/javascript">
    $(document).ready(function(){ 
          $('#picroll').cycle({                            
                timeout:.2,
                delay:  0, 
        fx: 'fade',
        continuous: false,
                speed:  300,
                autostop: 1
         }).cycle("pause").hover(function() {
                $(this).cycle('resume');
         },function(){
                $(this).cycle('pause');
         $(this).cycle('resume');
   })
     .mouseleave(function(){
        $(this).cycle(0, 'fade').cycle('play');
      });
    });
</script>

  <div id="picroll"><a href="#"><img src="images/group/PictureA.png" width="114" height="330"/>
  <img src="images/group/PictureB.png" width="114" height="330" /></div>

1 个答案:

答案 0 :(得分:1)

请改用:

$("#picroll").mouseover('
     $("#picroll:nth-child(1)").fadeOut(500);
     $("#picroll:nth-child(2)").fadeIn(500);
');
$("#picroll").mouseout('
     $("#picroll:nth-child(1)").fadeIn(500);
     $("#picroll:nth-child(2)").fadeOut(500);
');