我正在尝试使用 JS 创建简单的唱首歌游戏,并且我想为我的游戏添加一些动画。 每次单击按钮时,一点“$+1”应该动画到顶部并淡出。它可以工作,但只能单击一次。
$("#clicker").click(function(){
$("#fading_dolar").css("display","block");
$("#fading_dolar").animate({
bottom: "120px",
opacity: 0
}, {duration:1000, queue: false});
$("#fading_dolar").css({
"opacity": "1",
"bottom:": "60px"
});
});
<button id="clicker" onclick="click_f()">Click!</button>
<center><span id="fading_dolar">+$1</span></center>
最佳答案
尝试将 #fading_dolar
的 css
bottom
重置为 0px
at complete
.animate()
$("#clicker").click(function() {
var el = $("#fading_dolar");
el.finish().css("opacity", 1).animate({
bottom: "120px",
opacity: 0
}, {
duration: 1000,
queue: false,
complete:function() {
$(this).css("bottom", "0px")
}
});
});
#fading_dolar {
display: block;
position: relative;
bottom: 0px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="clicker">Click!</button>
<center><span id="fading_dolar">+$1</span>
</center>
关于javascript - 在 jquery 中每次单击都会启动新动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31372441/