Question

我想做的就是div首先随机出现然后让它们掉下来......这是我的代码

＆＃13;

$(document).ready(function(){
$('#test').animate({top: 80 + '%'},900);
});

＆＃13;

<div id="test" style="background:#98bf21;height:100px;width:100px;position:absolute;"></div>

＆＃13;

Answer 1

您可以使用window.settimeout来调用在随机间隔后创建div的函数，然后在函数完成后再次调用函数调用。

HTML：

<div id="container" class="container">
</div>

CSS

.container{
    width:500px;
    height:500px;
    background-color:lightblue;
}
.droper{
    background:#98bf21;
    height:100px;
    width:100px;
    position:absolute;
}

jquery的

var ranInterval = 1000 + Math.floor((Math.random() * 4000) + 1);
window.setTimeout( CreateDiv, ranInterval ); 

function CreateDiv()
{
    var ranLeft = Math.floor((Math.random() * 400) + 1);
    var ranInterval = 1000 + Math.floor((Math.random() * 4000) + 1);
    jQuery('<div class="droper" />').css({top: 0, left: ranLeft }).animate({top: "+=400px"}, 900 ).appendTo('#container' );

    window.setTimeout( CreateDiv, ranInterval );
}

这是一个展示代码的jsfiddle。 http://jsfiddle.net/chrustlesstulip/b8qo56j5/

随机显示div，然后在javascript中将它们向下移动

1 个答案: