jquery怎样设置才能做完上一步动画再执行下一步
比如$('pic1').hide(1000);$('pic2').show(1000);我的想法就是pic1完全消失以后再让pic2出现，但是现在它们两个几乎一起动画HT...
比如$('pic1').hide(1000);
$('pic2').show(1000);
我的想法就是pic1完全消失以后再让pic2出现，但是现在它们两个几乎一起动画
HTML：
<body>
<img id="pic1" src="pics/1.jpg" width="570" height="340" alt="entrysite" title="1" />
<img id="pic2" src="pics/2.jpg" width="570" height="340" alt="entrysite" title="2" />
<img id="pic3" src="pics/3.jpg" width="570" height="340" alt="entrysite" title="3" />
<img id="pic4" src="pics/4.jpg" width="570" height="340" alt="entrysite" title="4" />
</body>
JS:
window.onload=initial;
function initial(){
$('#pic2').hide();
$('#pic3').hide();
$('#pic4').hide();
picShow(1,2);
}
function picShow(last,next){
lastname='#'+("pic"+last);//需要消失的图片的选择器
nextname='#'+("pic"+next);//需要显示的图片的选择器
$(lastname).hide(1000,function(){
last<4?$(nextname).show(1000,nextturn(next)):$('#pic1').show(1000,nextturn(next));
});
}
function nextturn(last){
last<4?picShow(last,last+1):picShow(last,1);
}
当网页开始时，第一个图片消失后，所有图片会一起出现，这是为什么？ 展开
$('pic2').show(1000);
我的想法就是pic1完全消失以后再让pic2出现，但是现在它们两个几乎一起动画
HTML：
<body>
<img id="pic1" src="pics/1.jpg" width="570" height="340" alt="entrysite" title="1" />
<img id="pic2" src="pics/2.jpg" width="570" height="340" alt="entrysite" title="2" />
<img id="pic3" src="pics/3.jpg" width="570" height="340" alt="entrysite" title="3" />
<img id="pic4" src="pics/4.jpg" width="570" height="340" alt="entrysite" title="4" />
</body>
JS:
window.onload=initial;
function initial(){
$('#pic2').hide();
$('#pic3').hide();
$('#pic4').hide();
picShow(1,2);
}
function picShow(last,next){
lastname='#'+("pic"+last);//需要消失的图片的选择器
nextname='#'+("pic"+next);//需要显示的图片的选择器
$(lastname).hide(1000,function(){
last<4?$(nextname).show(1000,nextturn(next)):$('#pic1').show(1000,nextturn(next));
});
}
function nextturn(last){
last<4?picShow(last,last+1):picShow(last,1);
}
当网页开始时，第一个图片消失后，所有图片会一起出现，这是为什么？ 展开
5个回答
展开全部
$('pic1').hide(1000);
$('pic2').delay(1000).show(1000); delay(时间) 延时多少秒执行
<script src="jquery-1.7.1.min.js"></script>
<script language="javascript">
window.onload=initial;
function initial(){
$('#pic2').hide();
$('#pic3').hide();
$('#pic4').hide();
picShow(1,2);
}
function picShow(last,next){
lastname='#'+("pic"+last);//需要消失的图片的选择器
nextname='#'+("pic"+next);//需要显示的图片的选择器
// $(lastname).hide(1000,function(){
// last<4?$(nextname).show(1000,nextturn(next)):$('#pic1').show(1000,nextturn(next));
// });
$(lastname).hide(1000);
if(last<4)
{
$(nextname).delay(1000).show(1000);
setTimeout(function(){nextturn(next)},1000);
}
else
{
$('#pic1').delay(1000).show(1000);
setTimeout(function(){nextturn(next)},1000);
}
}
function nextturn(last){
last<4?picShow(last,last+1):picShow(last,1);
}
</script>
$('pic2').delay(1000).show(1000); delay(时间) 延时多少秒执行
<script src="jquery-1.7.1.min.js"></script>
<script language="javascript">
window.onload=initial;
function initial(){
$('#pic2').hide();
$('#pic3').hide();
$('#pic4').hide();
picShow(1,2);
}
function picShow(last,next){
lastname='#'+("pic"+last);//需要消失的图片的选择器
nextname='#'+("pic"+next);//需要显示的图片的选择器
// $(lastname).hide(1000,function(){
// last<4?$(nextname).show(1000,nextturn(next)):$('#pic1').show(1000,nextturn(next));
// });
$(lastname).hide(1000);
if(last<4)
{
$(nextname).delay(1000).show(1000);
setTimeout(function(){nextturn(next)},1000);
}
else
{
$('#pic1').delay(1000).show(1000);
setTimeout(function(){nextturn(next)},1000);
}
}
function nextturn(last){
last<4?picShow(last,last+1):picShow(last,1);
}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
JS:
$(function(){
$('#pic1').hide();
$('#pic2').hide();
$('#pic3').hide();
$('#pic4').hide();
function picShow(the){
$("#pic"+(the+1)).hide(1000,function(){
the=(the+1)%4;
$("#pic"+(the+1)).show(1000,function(){
picShow(the);
});
});
};
picShow(0);
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
jquery有animate方法，可以做动画效果，并且按步骤执行的话，可以用回调函数callback。不过我一般会用move.js。
如果你找到move.js的话上面有实例，个人感觉很好用，做全屏滚动之类的都会用这个框架。做你想要的这个效果，so easy啊。
如果你找到move.js的话上面有实例，个人感觉很好用，做全屏滚动之类的都会用这个框架。做你想要的这个效果，so easy啊。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
$(selector).hide(speed,callback)
callback 参数是在 hide 或 show 函数完成之后被执行的函数名称。
应该是这个意思:
$('pic1').hide(1000,function(){
$('pic2').show(1000)
});
你试试吧，我没试呢，重装系统了，懒得下编辑器了。
callback 参数是在 hide 或 show 函数完成之后被执行的函数名称。
应该是这个意思:
$('pic1').hide(1000,function(){
$('pic2').show(1000)
});
你试试吧，我没试呢，重装系统了，懒得下编辑器了。
追问
问题有补充，麻烦解答一下
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用settimeout延时启动第二句代码
追问
问题有补充，麻烦解答一下
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
