我正在使用 tutorial 的代码动画div,
jQuery(document).ready(function() {
jQuery('.post').addClass("hidden").viewportChecker({
classToAdd: 'visible animated fadeIn',
offset: 100
});
});
我有 float div,我怎样才能让它一个一个地动画而不是逐行地动画?
我尝试将下面的代码与之前的代码结合使用,但我不知道如何让它工作
.each(function(index){
var _this = this;
setTimeout( function(){ $(_this).fadeIn('slow'); }, 1000*index );
});
这是我的 Html
<div class="post">
<span class="icon fa fa-camera-retro"> </span>
<h2> Lorem ipsum dolor sit amet, consetetur sadipscing elitr</h2>
<p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, .</p>
</div>
<div class="post">
<span class="icon fa fa-camera-retro"> </span>
<h2> Lorem ipsum dolor sit amet, consetetur sadipscing elitr</h2>
<p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, .</p>
</div>
<div class="post">
<span class="icon fa fa-camera-retro"> </span>
<h2> Lorem ipsum dolor sit amet, consetetur sadipscing elitr</h2>
<p> At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, .</p>
</div>
CSS 代码
.post{
float:left;
padding:10px;
height:420px;
width:440px;
border:1px solid #ccc;
}
最佳答案
试试这个
$('.post').each(function(i,e){
$(this).show(3000);
});
关于javascript - 用Jquery动画让 float 的div一一出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41162678/