Question

我已经设法编写了一些随机淡入的jquery并逐个淡出一组div但我想要做的是一次淡入/淡出多个div。

以下是我现有的js：

(function makeDiv(){

var ids = [1,2,3,4,5,6,7,8,9];
var imgid = ids[Math.floor(Math.random() * ids.length)];
var divsize = 120;


$newdiv = $('<div/>').css({
    'width':divsize+'px',
    'height':divsize+'px'
}).attr('id', 'img'+imgid+'');

var posx = (Math.random() * ($(document).width() - divsize)).toFixed();
var posy = (Math.random() * ($(document).height() - divsize)).toFixed();

$newdiv.css({
    'position':'absolute',
    'left':posx+'px',
    'top':posy+'px',
    'display':'none'
}).appendTo( 'body' ).fadeIn(500).delay(500).fadeOut(500, function(){
   $(this).remove();
   makeDiv(); 
}); 
})();

您可以在www.vouchrs.com上看到它。

如何一次实现多次淡入/淡出？感谢

Answer 1

会是这样的：

$(".something").click(function(){
   $(".divsToFadeInOrOut").each().fadeToggle();
});

我认为这应该做你想要的。

Answer 2

你在完成fadeIn时调用makeDiv，此时延迟fadeOut链。您可以在没有所有链接的循环中执行“appendTo”，然后使用选择器并行调用该链。我建议在新的div中添加一个类，以便更容易编写选择器。

Answer 3

你也可以这样做

（函数makeDiv（）{

var ids = [1,2,3,4,5,6,7,8,9];

var imgid1 = ids[Math.floor(Math.random() * ids.length)];
var divsize = 120;
var imgid = ids[Math.floor(Math.random() * ids.length)];
var idP = '';


$newdiv = $('<div/>').css({
    'width':divsize+'px',
    'height':divsize+'px'
}).attr('id', 'img'+imgid+'');

 $newdiv1 = $('<div/>').css({
    'width':divsize+'px',
    'height':divsize+'px'
}).attr('id', 'img'+imgid1+'');


var posx = (Math.random() * ($(document).width() - divsize)).toFixed();
var posy = (Math.random() * ($(document).height() - divsize)).toFixed();

 var posx1 = (Math.random() * ($(document).width() - divsize)).toFixed();
var posy1 = (Math.random() * ($(document).height() - divsize)).toFixed();


$newdiv.css({
    'position':'absolute',
    'left':posx+'px',
    'top':posy+'px',
    'display':'none'
}).appendTo( 'body' ).fadeIn(500).delay(500).fadeOut(500, function(){
   $(this).remove();
   //makeDiv(); 
}); 

 $newdiv1.css({
    'position':'absolute',
    'left':posx1+'px',
    'top':posy1+'px',
    'display':'none'
}).appendTo( 'body' ).fadeIn(500).delay(500).fadeOut(500, function(){
   $(this).remove();
   makeDiv(); 
});

}）（）;

你可以编写函数来生成多个div，就像我给出了一个同时生成两个div的例子，我手动完成了这个，但你可以创建一个生成多个div的函数，最后你可以调用makediv（）函数。

一次淡入多个div

3 个答案: