点击显示并隐藏菜单

时间:2011-09-06 09:15:05

标签: javascript jquery fade

我昨天问了一个关于点击显示菜单的问题,这个菜单得到了很好的回答。但是,我想知道如何在单击文本“项目信息”时使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(); });

4 个答案:

答案 0 :(得分:4)

您是否尝试过fadeToggle()方法?

像这样:

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

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

答案 1 :(得分:0)

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

答案 2 :(得分:0)

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

答案 3 :(得分:0)

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

$('your_div').fadeIn(100);
$('your_div').fadeOut(100);
豫ICP备18024241号-1