按顺序切换和淡入淡出效果
按顺序切换和淡入淡出效果
提问于 2011-02-17 11:58:01
我希望在jQuery中切换滑下，然后淡入和淡出，然后再滑出效果。有没有可能用toggle做这样的事情？我目前有：
<a href="#" id="toggle">more</a>
<div id="about">
<p id="info">...</p>
</div>
<script>
$('#toggle').click(function() {
$('#about').toggle('fast', function() { $('#info').fadeIn(); });
});
</script>但它只适用于最初的点击。可以将两个功能添加到click，并在其间切换吗？有没有一种不用跟踪状态变量就能做到这一点的方法？谢谢!
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-02-17 12:23:30
已解决：
$("#info").toggle(
function () { $("#about").toggle('fast', function () { $("#info").fadeToggle('fast'); }); },
function () { $("#info").fadeToggle('fast', function () { $("#about").toggle('fast'); }); }
);Stack Overflow用户
发布于 2011-02-17 12:03:37
您可以使用is()和:visible来检查状态。试试这个：
<script>
$('#toggle').click(function() {
var about = $("#about")
if(about.is(':visible')){
$('#about').toggle('fast', function() { $('#info').fadeOut(); });
}
else{
$('#about').toggle('fast', function() { $('#info').fadeIn(); });
}
});
</script>Stack Overflow用户
发布于 2011-02-17 12:09:38
您可以考虑使用FadeToggle
http://api.jquery.com/fadeToggle/
<script>
$('#toggle').click(function() {
$('#about').toggle('fast', function() {
$('#info').fadeToggle();
});
});
</script> 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/5024916
复制相关文章
相似问题
腾讯云开发者
