我怎样才能在这里获得子菜单?

时间:2013-07-17 09:15:32

标签: jquery html css submenu

我正在写一个网站atm,现在我们有一个子菜单放在主菜单下面的一行。但是如果你把主菜单放在主菜上,我们决定制作一个可以折叠的子菜单。在此处http://www.nvidia.de/page/home.html

<!-- main-menu start -->
            <div id="menu">
                <ul class="menu">
                    <li><a href="index.html"><span>Home</span></a></li>
                    <li><a class="active" href="events.html"><span>Events</span></a></li>
                        <ul> <li> <a class="submenu" href="#"> Umfrage </a> </li> </ul>
                    <li><a href="galerie.html"><span>Galerie</span></a></li>
                    <li><a href="locations.html"><span>Locations</span></a></li>
                    <li><a href="tanzschulen.html"><span>Tanzschulen</span></a></li>
                    <li><a href="festivals.html"><span>Festivals</span></a></li>
                    <li><a href="reisen.html"><span>Reisen</span></a></li>
                    <li><a href="community.html"><span>Community</span></a></li>
                </ul>
            </div>
            <!-- main-menu end -->

            <!-- sub-menu start -->
            <script type="text/javascript">
                function openwindow() {
                window.open ("./loginpage.php","openwindowname","width=350,height=150,scrollbars=no,resizable=no,toolbar=no,location=no,directories=no,status=no,menu  bar=no,copyhistory=no,");
                                        }
                        function closewindow() {
                        window.close()
                                                }
            </script>

            <div id="submenu">
                <ul class="submenu">
                    <li><a href="#">Umfragen</a></li>
                    <li class="login-logout"><a href="registrieren.html">Registrieren</a> | <a href ="#openModal">Login</a></li>
                    <div id="openModal" class="modalDialog">
                        <div>
                            <a href="#close" title="Close" class="close">X</a>
                            <h2>Login</h2>
                            <form action="">
                                            <table border="0" cellpadding="3" cellspacing="0">
                                                <tr><td class="first">E-Mail</td><td><input name="name" type="text" size="30" placeholder="E-Mail"></td></tr>
                                                <tr><td class="first">Passwort</td><td><input name="email" type="text" size="30" placeholder="Passwort"></td></tr>
                                                <td class="col_1 col_last"><div style="margin-top: 12px" class="checkbox_container"><input type="checkbox" name="autologin" id="autologin" value="1" class="checkbox"> <label for="autologin">Angemeldet bleiben</label></div></td>
                                                </tr>
                                            </table>
                                        </form>
                                        <div class="send-button2">
                                            <label class="party ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button"><span class="ui-button-text"><a href="#close" title="Close">Login</a></span></label>                                         
                                        </div>
                        </div>
                    </div>
                </ul>
            </div>
            <!-- sub-menu end -->
到目前为止看起来如何,我真的不知道如何在那里获得这样的子菜单。有人可以帮我一点吗?

1 个答案:

答案 0 :(得分:0)

最简单的方法是使用jQuery UI Menu小部件:

http://jqueryui.com/menu/