javascript - SlideUp 向下滑动

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 标签作为链接，当我单击关于“链接”时，home div 必须缓慢向上滑动，而 about div 应该缓慢下降。请帮忙！

先感谢您

Answer 1

不久前我来过这个不错的。它很简单而且很有效。

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 没有的地方使用了它。所以似乎也不冲突。

Answer 2

在代码的最后一行，将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";
        }

    }); 
});