drop down wont drop Options

[miix-tape]

k i jsut made a drop down layout... but the drop down menu just stays open. ive made 1 before n it worked out great. heres the 1 im making now click
this is the one i made before click

this is the code im using now

<!-- begin code provided by createblog.com --><br /><style type=text/css><br />/* edit to your liking */<br />table.module { border: 0px solid #transparent; width:160px; background-color:transparent; }<br />table.module th { background-color: #transparent;font: bold 11px arial; text-transform: uppercase;color: #ff0000; border: none; }<br />table.module td {color: #ffffff; text-align: justify; border: none; background-image: none; }<br /></style><br /><br /><!-- add this below all the CSS --><br /><br /><table border=0 width="520"><tr><td valign="top" width="160"><br /><table border="0" cellspacing="0" cellpadding="4" width="100%" class="module"><tr><th valign="top" align="center" class="module"><b></b></th></tr><tr><td valign="top" class="module"> <br /><style type="text/css"><br />.menutitle{<br />cursor:pointer;<br />margin-bottom: 5px;<br />background-color:#000000;<br />font color:#ffffff<br />color:#666;<br />width:520px;<br />padding:2px;<br />text-align:center;<br />font-weight:bold;<br />/*/*/border:0px solid #000000;/* */<br />}<br /><br />.submenu{<br />margin-bottom: 0.5em;<br />}<br /></style><br /><br /><script type="text/javascript"><br /><br /><br />if (document.getElementById){ //DynamicDrive.com change<br />document.write('<style type="text/css">\n')<br />document.write('.submenu{display: none;}\n')<br />document.write('</style>\n')<br />}<show><br /><br />function SwitchMenu(obj){<br /> if(document.getElementById){<br /> var el = document.getElementById(obj);<br /> var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change<br />  if(el.style.display != "block"){ //DynamicDrive.com change<br />   for (var i=0; i<ar.length; i++){<br />    if (ar[i].className=="submenu") //DynamicDrive.com change<br />    ar[i].style.display = "none";<br />   }<br />   el.style.display = "block";<br />  }else{<br />   el.style.display = "none";<br />  }<br /> }<br />}<br /><br /></script><br /><!-- Keep all menus within masterdiv--><br /><div id="masterdiv"><br /><br /> <div class="menutitle" onclick="SwitchMenu('sub1')">little birdy</div><br /> <span class="submenu" id="sub1"><br /> -------------------------type about yourslef here-------------------<br /> </span><br /><br /> <div class="menutitle" onclick="SwitchMenu('sub2')">peek inside</div><br /> <span class="submenu" id="sub2"><br /> <marquee width="130" scrollamount="2"> <b></b></marquee><br><br><MARQUEE behavior=alternate><br /> <MARQUEE width=200> ---------------------ADD YOUR FAV ICONS HERE!<img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE">  </MARQUEE></MARQUEE><script></script> <br /> </span><br /><br /><br /> <div class="menutitle" onclick="SwitchMenu('sub3')">screws fall out</div><br /> <span class="submenu" id="sub3><br /> <center><font color=ffffff>mmk </font><br /> <a href="http://www.xanga.com/basement_show_layouts"><img src="http://img18.imageshack.us/img18/3870/contestlovex39vw.gif" border=0></a></center><br /> </span><br /><br /> <div class="menutitle" onclick="SwitchMenu('sub4')">so lost</div><br /> <span class="submenu" id="sub4"><br /> <a href="http://www.xanga.com/">.com</a> - <a href="http://www.xanga.com/Private/SubscribeTo.aspx?user=YOURUSERNAMEHERE">eavse drop</a> - <a href="http://www.xanga.com/claf">mending</a> - <a href="http://www.xanga.com/private">sit alone</a> - <a href="http://www.xanga.com/private/subs.aspx">envy</a> - <a href="http://www.xanga.com/logout.aspx">piss off</a><br /> </span><br /> <br /></div></td></tr></table><br><br /></td><br /><br /><style type="text/css"> <br />table.navigation, table.left, table.search, #SearchBar1_pnlYouAreHere,    {display: none;}<br />body { <br />   <br />  scrollbar-arrow-color: #ffffff; <br />  scrollbar-track-color: #ffffff; <br />  scrollbar-shadow-color: #000000; <br />  scrollbar-face-color: #ffffff; <br />  scrollbar-highlight-color: #ffffff; <br />  scrollbar-darkshadow-color: #000000; <br />  scrollbar-3dlight-color: #000000;  <br />  background-color:#000000;<br />  background-image: url(http://img500.imageshack.us/img500/3280/605504ic.gif);<br />  background-attachment: fixed;<br />  background-position: bottom right;<br />  background-repeat: no-repeat;} <br /> <br />.left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p { <br />/* edits main text */ <br />  font:normal 11px terminal; <br />  line-height:11px; <br />  color:ff0000; <br />  letter-spacing:0px; <br />  text-align:left; <br />  } <br />b, strong{<br />color: #E57625;<br />letter-spacing: -1px;<br />font: bold 11px arial;<br />text-transform: uppercase;}<br /> <br />table.left i, .blogbody i, .standard i, a:link i, a:visited i, .footernav.link i, a.footernav:link i, a.footernav:active i, p i, em {<br />/* edits italic text in your entry */<br />font-weight: italic;<br />color:#990000;<br />line-height: 12px;}<br />.blogbody u, p u, u {<br />/* edits underlined text in your entry */<br />font-weight: underlined;<br />border-bottom:solid 2px #C73D3B; <br />color:#990000;<br />font-family: terminal;<br />font-size:11px;<br />text-transform: none;<br />line-height: 12px;<br />letter-spacing: -1px;<br />}<br /><br />table.footer TD { <br />/* this makes the footer at the bottom centered */ <br />/* leave it alone unless you know what to do*/ <br />  text-align: center; <br />  display:none;} <br /> <br />div.blogheader, .caption { <br />/* edits the dates */ <br />  width: 180px;<br />font:normal 11px terminal; <br />  text-transform:uppercase; <br />   border:1px solid #transparent;<br />  line-height:12px; <br />  font-weight:none; <br />  color:#990000; <br />  letter-spacing:1px; <br />  background-color: transparent; <br />  text-align: center; <br />  width:200px;<br />     } <br /> <br />a:link, .footernav.link, a.footernav:link, a.footernav:active { <br />/* edits all links */ <br />color:#fffff; <br />  font:normal f6px terminal;<br />  line-height:12px; <br />   text-transform: uppercase;<br />  text-decoration: none; <br />  letter-spacing: 1px;<br />    background-color:transparent}  <br /> <br />a:visited, a.footernav:visited,  { <br />/* edits the links that the user has visited */ <br />  color:#ffffff; <br />  font:normal 6px terminal;<br />  line-height:12px; <br />   text-transform: uppercase;<br />  text-decoration: none; <br />  letter-spacing: 1px;<br />    background-color:transperent<br />}  <br />a:hover { <br />/* edits when user mouseovers the links */ <br />  color:000000; <br />  font:normal 6px terminal;<br />  line-height:12px; <br />   text-transform: uppercase;<br />  text-decoration: none; <br />  letter-spacing: 0px;<br />   background-color:#transparent;<br />   border-bottom: 1px solid #000000; }   <br />input, select, textarea, .textfield, .button { <br />/* this edits the buttons, dropdowns, etc. */ <br />  border: 1px solid #ff33ff; <br />  color:0066ff; <br />  font:normal 6px terminal;<br />  line-height:11px; <br />   text-transform: uppercase;<br />  text-decoration: none; <br />  letter-spacing: 1px;<br />    background-color:#transparent;<br />  } <br /> <br />table.left {  <br />/* this edits the menu module */ <br />  border: none;  <br />  width:150px; <br />   background-color: transparent; <br />   background-image: url(); } <br /> <br />table.blogbody { <br />/* this edits the other the place where the  blog is */ <br />  border-top: none; <br />   background-color: transparent; <br />  width:250px; <br />  border-left:0px solid #transparent;<br />  border-right:0px solid #transparent;<br />  border-bottom: 0px solid #transparent;<br /> } <br /> <br />table.left th { <br />/* on your menu module, this edits the title part of it */ <br />/* like BLOGRINGS, POSTING CALENDAR, etc */ <br />    display:none; } <br />table.left TD { <br />/* on your menu module, this edits the body part of it */ <br />  background-color: transparent; <br />  border: NONE; <br />  text-align: center; <br />  background-image: url(); } <br /> <br />table.search TD, table.search, table.announcements { <br />/* border of search bar (if you have it) */ <br />  background-color: ##008158;  <br />  border: 1px solid #000000;  <br />  } <br />table.search TD, table.announcements TH { <br />/* this should be left alone */ <br />/* unless you know what to do */ <br />  border: none; <br />  } <br />table.navigation, table.main, table.footer { <br />/* the width of your blog with modules */ <br />  width: 180px; <bslayouts><br />  } <br />hr { <br />/* horizontal divider */ <br />  border: 1px solid #008158; <br />  } <br /></style></center><br /><!-- end code provided by createblog.com -->

i want the menu to work like the batman one..... can someone please help me!