0

I am trying to make a simple dropdown menu with jquery but I cant seem to get any of the javascript to work. I have tried calling it externally. I am not sure what the problem can be, if you see a problem please let me know. Thanks.

 <html>
    <head>
        <title></title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

    <style type="text/css">
    #container{width:978px;}
    .content {
        display: none;
        padding-left: 5px;
        left: 0px;
        width: 100%;
        top: 30px;
        background: yellow;
    }
    ul{width: 100%;}
    li{
        float: left;
        padding: 5px;
        background: #e5e5e5;}

    #div{
        background: #9e9e9e;
        height: 20px;
        width: 978px;
    }
    br{
        clear: left;
    }​
    </style>

    <script type="text/javascript">
        $(function() {
        $('.action').click(function() {          
            var name = $(this).attr("name");
            var content = $('.content[name=' + name + ']');
            $('.content').not(content).hide('fast');
            content.slideToggle('fast');
        });
    });​

    </script>
     </head>
    <body>

    <div id="container"><ul>
        <li>
            <a href="#" class="action" name="summer">summer</a>
        </li>
        <li>
            <a href="#" class="action" name="winter">winter</a>
        </li>
        <li>
            <a href="#" class="action" name="weather">weather</a>
        </li>
        </ul></div><br>
        <div class="content" name="summer">
            <a href="link">june</a>
            <a href="link">july</a>
        </div>
        <div class="content" name="winter">
                <a href="link">november</a>
                <a href="link">december</a>
            </div>
        <div class="content" name="weather">
                <a href="link">rain</a>
                <a href="link">sun</a>
        </div>

        <div id="div"></div>​


    </body>
    </html>
4

4 回答 4

1

试试 SuperFish => http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started

于 2012-07-03T16:13:02.250 回答
0

样式和脚本标签应该在你的 head 标签内。（尽管有些人将所有脚本都放在结束正文标记之前）

如果没有 doctype，就会发生奇怪的事情。在打开的 html 标记之前添加“<!doctype html>”。

于 2012-07-03T16:11:20.417 回答
0

我复制了你的代码，在第 42 行，第二个“});”之后有一个非法字符。我删除了它，它正在工作。

于 2015-01-03T18:25:36.537 回答
0

不知道为什么你有一个双斜杠：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

除非你的意思是：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
于 2012-07-03T16:26:18.990 回答