我现在刚刚迈出了关于 jQuery animate() 的第一步。我试图制作一个演示类型的东西只是为了练习，但我似乎无法使用 animate() 函数更改动画中间的 div 文本。
这是我当前的代码：
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script>
<script>
$(document).ready(function(){
$("button").click(function(){
var div=$("div");
div.animate({left:'100px'},"slow");
div.animate({fontSize:'3em'},"slow");
div.animate({fontSize:'1em'},2000);
div.animate({opacity:'0'},"slow");
//can I change the text with animation???
div.animate({opacity:'1'},"slow");
div.animate({left:'0px'},"slow");
});
});
</script>
</head>
<body>
<button>Start Animation</button>
<div id='text' style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div>
</body>
</html>
有没有一种实用的方法可以在不透明度关闭时更改文本，以便当动画返回时文本发生更改？
您可以使用队列功能排队更改。
$(document).ready(function(){
$("button").click(function(){
var div=$("div");
div.animate({left:'100px'},"slow");
div.animate({fontSize:'3em'},"slow");
div.animate({fontSize:'1em'},2000);
div.animate({opacity:'0'},"slow");
div.queue(function() {
div.html('New text');
div.dequeue(); // This is necessary to continue the animation
});
div.animate({opacity:'1'},"slow");
div.animate({left:'0px'},"slow");
});
});
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
