jQuery slideUp和slideDwon问题

时间:2012-12-16 22:55:28

标签: jquery slidedown

我需要在页面加载后立即隐藏类“二和三”,并且能够再次单击菜单以将其向下滑动,我正在使用以下代码进行验证:

$(document).ready(function() 
{

$('.two, .three').slideUp('slow');

$('.active_wrapper').click(function(){
    $('.two, .three').slideDown('slow');
});

});

HTML

<div class="nav_wrapper">

    <div class="active_wrapper one"><a class="active" href="">home</a></div>

    <div class="two"><a href="about.html">about</a></div>

    <div class="three"><a href="project.html">project</a></div>

</div>

2 个答案:

答案 0 :(得分:1)

尝试这样 - DEMO

$(document).ready(function() 
{

$('.two, .three').slideUp('slow');

$('.active_wrapper').click(function(e){
    e.preventDefault();
    $('.two, .three').slideToggle('slow');
});

});​

答案 1 :(得分:1)

这是jsfiddle http://jsfiddle.net/L6PkX/

在.two,.three上使用css display none并删除幻灯片

<div class="nav_wrapper">

    <div class="active_wrapper one"><a class="active" href="#">home</a></div>

    <div class="two"><a href="about.html">about</a></div>

    <div class="three"><a href="project.html">project</a></div>

</div>

$(document).ready(function() 
{


$('.active_wrapper').click(function(){
    $('.two, .three').slideDown('slow');
});

});

.two, .three{
    display: none;
}}