使用相同的链接onclick淡入和淡出div [英] Fade div in and out using the same link onclick
本文介绍了使用相同的链接onclick淡入和淡出div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我可以通过单击淡入div,但是如何使用相同的单击来切换该div,即在单击时淡入div,然后在第二次单击时淡出div.
I can fade a div in with a click but how do I use the same click to toggle that div, i.e. fade the div in on click and then fade the div out on second click.
我希望单击一次导航栏以打开叠加层,然后再次单击以淡出叠加层.
I'd like navbar-toggle to be clicked once to open overlay and clicked again to fade out overlay.
<script>
$(document).ready(function(e) {
$('.navbar-toggle').click(function(e){
$('.overlay, .popup').fadeIn('slow');
});
$('.navbar-toggle').click(function(e){
$('.overlay, .popup').fadeIn('slow');
});
});
</script>
推荐答案
您可以通过以下几种方法来实现:
You can do it a couple of ways:
解决方案1:
使用toggle()
$('.navbar-toggle').click(function(e){
$('.overlay, .popup').toggle('fast');
});
JSFiddle Demo
解决方案2:
使用fadeToggle()
$('.navbar-toggle').click(function(e){
$('.overlay, .popup').fadeToggle(300);
});
JSFiddle Demo
解决方案3:
有一个隐藏的类并检查它是否存在
Have a hidden class and check to see if it exists
这篇关于使用相同的链接onclick淡入和淡出div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文