Question

网页设计的新手。我试图创建一个带有滑动菜单的网站，但遗憾的是我在初始阶段本身就遇到了jquery。

这是我的HTML页面（index.html）

<div class="titlebar" align="middle">
    <div class="nav">
        <div id="menu_products" class="menu">
            <a href="#" class="prodlink">Products</a>
        </div>
        <div id="menu_logo" class="menu">
            <b><a href="">company name</a></b>
        </div>
        <div id="menu_account" class="menu">
            <a href=""> Account</a>
        </div>
    </div>
    <div class="products" id="productlist">
        <br /><br /><br /><br /><br />
            <a href="" class="prod_nav">Computers</a>
            <a href="" class="prod_nav">Laptops</a>
            <a href="" class="prod_nav">Tablets</a>
            <a href="" class="prod_nav">Smart Phones</a>
    </div>              
</div>

这是我的jquery（index.js）

$("a.prodlink").click(function() {
    $(".products").slideUp();
});

Answer 1

我猜测JS只是没有等待DOM准备就绪。试试这个：

$(document).ready(function(){
    $("a.prodlink").click(function() {
        $(".products").slideUp();
    });
});

Answer 2

您可能希望slideToggle用于解决您的特定问题。

查看http://jsfiddle.net/tchow002/LvVAu/6/的工作示例。

如果您点击产品链接时没有发生任何事情，请查看@Pavel Patino的答案。

jquery slideUp不起作用

2 个答案: