我想在 jquery 1.3 中为一系列项目制作动画,每个下一个项目在第一个动画的中途开始。换句话说,我想要一个半队列的效果。我尝试使用下面的代码,但它不起作用。有人有什么想法吗?
$("h3").click(function(){
$(".projectItem").each(function (i) {
if (i > 0){
setTimeout ("", 500);
}
$(this).animate({"opacity": 0, "duration": 1000});
});
});
PS:我尝试使用各种“空闲”或“暂停”jquery 插件,但我怀疑所使用的技术是 jquery 1.3 之前的技术?
PPS:提前感谢您的帮助:)
最佳答案
你可以尝试这样的事情:
$("h3").click(function(){
$(".projectItem").each(function (i) {
// store the item around for use in the 'timeout' function
var $item = $(this);
// execute this function sometime later:
setTimeout(function() {
$item.animate({"opacity": 0}, 1000);
}, 500*i);
// each element should animate half a second after the last one.
});
});
这里的总体思路是使用 .projectItem
列表 - 将动画从开始延迟到每个项目 500 毫秒。第一项 (i=0
) 将有 0 毫秒的延迟,并在下一个事件循环期间(几乎)立即执行。其他每个项目都会在其之前延迟 500 毫秒,并且由于您的动画持续 1000 毫秒,因此它将在最后一个项目动画的大约一半处开始。
关于jquery - 交错 jQuery 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1981645/