我用这个例子试用了jquery:
$(document).ready(function(){
$("button").mouseover(function(){
$("p#44.test").css("background-color","yellow");
$("p#44.test").hide(1500);
$("p#44.test").show(1500);
$("p#44.test").css("background-color","red");
});
});
我预计会发生以下情况:
1. Color of <p> to turn yellow
2. <p> to slowly fade
3. <p> to slowly show
4. Color of <p> to turn red
但实际情况是这样的:
1. <p> turned red
2. <p> slowly hid away
3. <p> slowly showed
为什么会这样呢?
发布于 2010-11-26 15:12:27
.css()
函数不会在运行的动画之后排队,它是即时的。
要匹配您所追求的行为,您需要执行以下操作:
$(document).ready(function() {
$("button").mouseover(function() {
var p = $("p#44.test").css("background-color", "yellow");
p.hide(1500).show(1500);
p.queue(function() {
p.css("background-color", "red");
});
});
});
.queue()
函数等待正在运行的动画运行完毕,然后触发所提供的函数中的所有内容。
https://stackoverflow.com/questions/4283141
复制相似问题