我有 10 个具有相同类".tile"的框,我写了一段 jquery 代码,它将在文档加载时运行:
.HTML:
<li>
<a class="tile" href="#dev">
<div class="boximg"></div>
<div class="boxttl">
<span class="engttl">Develope Your Mobile</span>
<span class="fattl">آموزش و توسعه موبایل</span>
</div>
</a>
</li>
JQUERY :
function func2($this) {
if ($(this).find('.engttl').length)
$this = this;
if ($($this).attr('_to_animate') != 'true')
return;
$($this).find('.engttl').delay(2000).animate({marginTop:"-23px"},1100,'easeOutExpo',function(){
var $this2 = this;
setTimeout(function(){
$($this2).animate({marginTop:"0"},1100,'easeOutExpo',function(){
setTimeout(function(){ func2($this); },1500);
});
},1500);
});
}
$('.tile').each(function(){
$(this).attr('_to_animate', 'true');
func2(this);
});
它按照我的期望工作正常,但是我如何在每个".tile"之间随机化动画?使用我的代码,在文档加载后,我们同时看到所有".tile"的动画,但我想在不同的时间分别看到每个".tile"的动画。如果有人知道如何做到这一点,我很感激?
将
.delay(2000)
换成.delay(Math.random() * 2000 + 1000)
值总共使延迟介于 1000 和 3000 毫秒之间。在调用 random()
时不需要使用任何参数。