这将在第一个动画完成后动画第二个图像:
<script type="text/javascript">
$(document).ready(function () {
$('#image1').show("slide", { direction: 'left' }, 1000,
function() { $('#image2').show("slide", { direction: 'left' }, 1000)});
</script>
如果我有四个图像,我在下面尝试-只有前两个图像动画。
<script type="text/javascript">
$(document).ready(function () {
$('#image1').show("slide", { direction: 'left' }, 1000,
function() { $('#image2').show("slide", { direction: 'left' }, 1000)},
function () { $('#image3').show("slide", { direction: 'left' }, 1000)},
function () { $('#image4').show("slide", { direction: 'left' }, 1000)});
</script>
那么,将所有图像(4)按顺序动画的有效方法是什么?
$('#image1').show("slide", { direction: 'left' }, 1000, function() {
$('#image2').show("slide", { direction: 'left' }, 1000, function () {
$('#image3').show("slide", { direction: 'left' }, 1000, function () {
$('#image4').show("slide", { direction: 'left' }, 1000);
});
});
});
你也可以这样做:
slide(1);
function slide(id){
if(id<5){
$('#image'+id).show("slide", { direction: 'left' }, 1000, function(){ slide(id+1));
}
}
我觉得这里的语法/格式不对。在第二行和第三行不应该使用的地方有右括号
<script type="text/javascript">
$(document).ready(function () {
$('#image1').show("slide", { direction: 'left' }, 1000, function() {
$('#image2').show("slide", { direction: 'left' }, 1000, function () {
$('#image3').show("slide", { direction: 'left' }, 1000, function () {
$('#image4').show("slide", { direction: 'left' }, 1000);
});
});
});
});
</script>