SlideUp slideDown

Question

我有这个javascript代码：

var x="#wrapper"
//var xyz;
$(document).ready(function(){ 
    $("#about").click(function(){
    if (!(x=="#about")){
        $(x).slideUp("slow",function(){
            $("#aboutus").slideDown("slow");
            });

            x="#aboutus";
        }
    });
});
$(document).ready(function(){
    $("#home").click(function(){ 
        if(!(x=="#wrapper")){
        $(x).slideUp("slow", function(){
            $("#wrapper").slideDown("slow");
            });
        dd="#wrapper";
        }
    });
});

有了这个“菜单”

<nav>
    <div class="menu">
        <ul class="ul">
    <h6>
                <li id="home" >Home</li >
                <li id="about">About</li >
                <li >performance</li >
                <li >testimonials</li >
                <li >faqs</li >
                <li >forum</li >
                <li onclick="slideUpDown()">Contact  </li >
            </ul>
        </h6>
    </div>
</nav> 

我必须使用li标记作为链接，并且当我单击about "link“时，home div必须慢慢滑上，about div应该慢慢滑下来。请帮帮我！

提前谢谢你

Answer 1

在代码的最后一行，将x设置为#wrapper not dd：

var x="#wrapper"

//var xyz; 
$(document).ready(function(){

    $("#about").click(function(){
        if (!(x=="#about")){
            $(x).slideUp("slow",function(){
                $("#aboutus").slideDown("slow");
            });
            x="#aboutus";
        }
    });

    $("#home").click(function(){ 
        if(!(x=="#wrapper")){
            $(x).slideUp("slow", function(){
                $("#wrapper").slideDown("slow");
            });
            x="#wrapper";
        }

    }); 
});

Answer 2

我前段时间发现了这个不错的。它很简单，而且很有效。

function toggleForm(x) {
        if ($('#'+x).is(":hidden")) {
            $('#'+x).slideDown(200);
        } else {
            $('#'+x).slideUp(200);
        }
}

那就称之为..。

onmousedown="javascript:toggleForm('div_ID');

为了不更改您的URL，请在同一调用的前面添加此内容

onclick="return false"

这样，您就可以使用一个脚本来调用任意多个slid操作。要作为目标的div是在调用中具有其ID的div。

编辑:对不起...我只是注意到它是jQuery，但不应该影响任何东西。我在其他jQuery没有使用的地方使用了它。因此，似乎没有任何冲突。