点击显示并隐藏菜单

Question

我昨天问了一个关于点击显示菜单的问题，这个菜单得到了很好的回答。但是，我想知道如何在单击文本“项目信息”时使div淡入淡出，然后在“再次单击项目信息”时再次淡出。我知道这可能是一个非常基本的东西，但我对javascript和jquery非常新，并会非常感谢一些帮助。 html代码如下：

<div  class="descinner">
    <a href="javascript:void(0);" class="showDesc">Project info</a>    
</div>

和Javascript：

$('.showDesc').click(function(e) { e.stopPropagation(); $(this).next().toggle(); });
$('body').click(function() { $('.showDesc').next().hide(); });

Answer 1

您是否尝试过fadeToggle（）方法？

像这样：

$('.showDesc').click(function() {
  $('.info').fadeToggle();
});

这将在第一次点击.info时显示.showDesc div，并在第二次点击时隐藏它（依此类推）..

Answer 2

查看FadeIn()功能。在要淡入的元素上使用它。

Answer 3

编写一个自定义函数并将其命名为onClick ...在该函数中你可以放入你的fadeIn和fadeOut ......你尤其不能用.toggle（）来实现它。

Answer 4

你有jQuery动画功能：fadeIn和fadeOut。你也可以使用show和hide功能。只需设置所需的速度参数

$('your_div').fadeIn(100);
$('your_div').fadeOut(100);