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的“链接”时，home div必须缓慢向上滑动，而about div应该会缓慢下降。 请帮忙！

先感谢您

Answer 1

在代码的最后一行，将x设置为#wrapper而不是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"

这样，您就可以使用一个脚本来调用任意数量的滑动操作。 要定位的div是在呼叫中具有其ID的div。

编辑：对不起...刚刚指出，它是jQuery，但不应影响任何事情。 我在其他jQuery没有使用的地方使用了它。 因此似乎没有任何冲突。