我想要这样的东西:
一个按钮触发脚本,然后当它完成时,同一个按钮将反向执行脚本(切换)
(我现在正在学习 javascript/jquery,所以我是一个完全的初学者)
例子:
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").animate(
{height: '250px'},
function(){ $("#hidden_txt").fadeIn(1000); } );
});
});
</script>
<button>Start</button>
<div style="background:#98bf21; height:100px; width:100px; position:absolute;">
<span id="hidden_txt" style="display: none">Hey, just checking !</span>
</div>
我找到了 css class toggle 的解决方案,但是:
- 当它关闭时,css类需要以相反的顺序关闭,所以先淡出然后div回到100px高度
- 在 IE9 和 IE8 中,CSS 转换不起作用:/
(jquery 1.12.4)
最佳答案
使用以下 JS:
<script>
var clicked=0;
$(document).ready(function(){
$("button").click(function(){
if(clicked==0){
$("div").animate(
{height: '250px'},
function(){ $("#hidden_txt").fadeIn(1000, function(){
clicked=1;
}); } );
}else if(clicked==1){
$("#hidden_txt").fadeOut(1000, function(){
$("div").animate(
{height: '100px'},
function()
{
clicked=0;
});
});
}
});
});
</script>
关于javascript - jquery 切换动画/以相反的顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37843583/