How can i get a submenu here?

问题

i am writing a website atm and for now we got a submenu which is placed in a line under the main menu. But we decided to make a submenu that folds down if you hover the main manu items. lile its here 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 -->

thats how it looks so far, and i really have no idea how to get such a submenu there. Can someone help me a bit with this?