jQuery点击弹出下拉菜单的小例子

ttx9n · 发表于 2013-8-1 15:46:34

这篇文章介绍了jQuery点击弹出下拉菜单的小例子，有需要的朋友可以参考一下复制代码代码如下:
<title>导航——点击弹出内容</title>
    <style type="text/css">
.navgation{margin:0;padding:0;list-style-type:none;position:relative;}
.navgation li {float:left;}
.navgation a{padding:3px 6px;background-color:orange;color:white;text-decoration:none;float:left;height:24px;}
.navgation a:hover {background-color:white;color:blue;text-decoration:underline;}
.navgation div{display:none;position:absolute;top:30px;}
</style>
    <script src="Jquery1.7.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".navgation input").each(function () {
                var this_div = $(".navgation div");
                var _inx = $(".navgation input").index(this);
                $(this).click(
                function () { this_div.eq(_inx).slideToggle(); },
                function () { this_div.eq(_inx).slideToggle(); }
           );
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <ul class="navgation">
            <li><input type="button" id="button" value="链接1"/>
            <div>这里放下拉内容1</div>
            </li>
            <li><input type="button" id="button1" value="链接2"/>
            <div>这里放下拉内容2</div>
            </li>
            <li><input type="button" id="button2" value="链接3"/>
            <div>这里放下拉内容3</div>
            </li>
            <li><input type="button" id="button3" value="链接4"/>
            <div>这里放下拉内容4</div>
            </li>
            <li><input type="button" id="button4" value="链接5"/>
            <div>这里放下拉内容5</div>
            </li>
        </ul>
    </div>
    </form>
</body>

rveqwdpw5 · 发表于 2022-9-19 05:38:56

iiguuubhuiuihu

回复用户5 · 发表于 2023-1-28 13:58:38

了乐趣了去了去了去了去了

kwa3hgmjp · 发表于 2023-6-12 01:55:16

借款金额看了就立刻

locopy · 发表于 2023-6-24 00:10:05

好东西可以可以可以可以

rveqwdpw5 · 发表于 2023-7-27 22:28:23

看看看咋么

kwzc65wdj · 发表于 2024-3-22 23:22:31

来看看怎么样

nwk53kbd · 发表于 2024-5-27 21:25:15

dfdsafdsfdsfdsf

thywok · 发表于 2024-6-19 17:51:41

飞飞飞飞飞飞飞飞飞飞飞飞飞

shw5ovr · 发表于 2024-9-2 01:54:28

呵呵呵呵呵呵

账号		自动登录	找回密码
密码			立即注册

[JavaScript] jQuery点击弹出下拉菜单的小例子

相关帖子