0

我有一个小提琴设置，但我需要扩展它，我整晚都尝试过但失败了，所以我已经剥离了所有尝试，只留下了主要部分。请看这个小提琴。

http://jsfiddle.net/bloodygeese/nqQG9/

我想知道如何“循环”整个动画无限，但最重要的是能够在鼠标进入或悬停任何一个 div 时暂停动画，然后在 mouseout 上继续动画或单击链接将链接关闭页面。

**如果这是可能的（不确定）我很想随机化 div 出现的时间，但总是可见 1/2 秒？] 下面的小提琴代码..

 $('#one').delay(2000).fadeIn(200);
 $('#one').delay(500).fadeOut(200);

 $('#two').delay(3000).fadeIn(200);
 $('#two').delay(500).fadeOut(200);

 $('#three').delay(4000).fadeIn(200);
 $('#three').delay(500).fadeOut(200);

 $('#four').delay(5000).fadeIn(200);
 $('#four').delay(500).fadeOut(200);

 $('#five').delay(6000).fadeIn(200);
 $('#five').delay(500).fadeOut(200);

 $('#six').delay(7000).fadeIn(200);
 $('#six').delay(500).fadeOut(200);
4

1 回答 1

0

以下代码随机淡化元素并在鼠标悬停时暂停淡化效果。它要求您将“box”类添加到所有元素。

    $(function () {
        function fadeAll() {
           var id = 1 + parseInt(Math.random() * 5) % 5;
           $('.box:nth-child('+id+')').stop().delay(500+parseInt(Math.random() * 500)).fadeIn('fast', function () {
              $(this).stop().delay(500 +parseInt(Math.random() * 500)).fadeOut('fast');
           })
           window.timeout = window.setTimeout(fadeAll, 500);
        }

        $('.box').hover(function(){
           $(this).css('opacity', 1);
           window.clearTimeout(window.timeout);
           $('.box').stop();
        },function(){
           $('.box').fadeOut('fast');
           window.timeout = window.setTimeout(fadeAll, 500);
        });

        fadeAll();
     })
于 2013-04-07T12:41:56.367 回答