执行两个div在相同的javascript

我试图在两个不同的div类在同一时间淡入淡出效果。为此，我需要两个不同的脚本，并为两个div执行相同的脚本，但它滞后。有什么办法可以在（.fadein，.fadeo）这样的脚本中执行这两个div吗？ FIDDLE- jsfiddle.net/562am/。执行两个div在相同的javascript

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script> //Function 1 
$(function(){ 
    $('.fadeo img:gt(0)').hide(); 
    setInterval(function(){$('.fadeo :first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadeo');}, 2000); 
}); 
</script> 

<script> //Function 2 
$(function(){ 
    $('.fadein img:gt(0)').hide(); 
    setInterval(function(){$('.fadein :first-child').fadeOut().next('img').fadeIn().end().appendTo('.fadein');}, 2000); 
}); 
</script>

来源

2013-07-28 Rachit Sharma

我冒昧地将[tag：java]标签更改为[tag：javascript]标签。请注意，这两种语言有很大的不同，如果你想得到专家在你的问题领域的帮助，你会非常小心你使用的标签。举个例子，我在Java中的表现相当不错，但是我对你的问题可能并不是丝毫的线索。祝你好运！ –

非常感谢。期待尽快帮助。 –

你想达到类似吗？ http://jsfiddle.net/XVfMw/ –

这是你的意思将两者结合为一个函数？

$(function(){ 
    var classes = ['.fadeo', '.fadein']; 

    $.each(classes, function (index, elem){ 
     var selectorToHide = elem + ' img:gt(0)', 
      selectorToFadeOut = elem + ' :first-child'; 

     $(selectorToHide).hide(); 
     setInterval(function() { 
      $(selectorToFadeOut) 
       .fadeOut() 
       .next('img') 
       .fadeIn() 
       .end() 
       .appendTo(elem); 
      }, 
      2000); 
    }); 
});

来源

2013-07-28 14:25:54

2对自己的setInterval运行 - 它们可能产生的滞后。正确的方法是使用1个区间并在那里完成整个逻辑。
使用appendTo您每2秒更改一次DOM。此方法会导致额外的性能问题并导致应用程序运行速度降低我建议你保留一个当前图像的索引，并根据需要进行更改（如下所示）。
在我的例子中，我计算了图像的最小数量（如果单独的div有不同的图像数量）。

$(function() { 
    // a value can be fixed - a constant 
    var imagesCount = Math.min($('.fadeo > img').size(), 
          $('.fadein > img').size()); 
    var i = 0; 
    display(i); 
    setInterval(function() { 
     i = (i+1) % imagesCount; 
     display(i); 
    }, 2000); 
}); 

function display(nth) { 
    $('.fadeo > img').hide().eq(nth).show(); 
    $('.fadein > img').hide().eq(nth).show();  
}

来源

2013-07-28 14:35:39 HeM01

执行两个div在相同的javascript

回答

相关问题