<! Doctype HTML public "-// W 3c // Dtd xhtml 1.0 strict // "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<! -- Author: Stupid cat ICQ: 278306428 blog: http://blog.sina.com.cn/u/1234091924 -->
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Meta name = "author" content = "stupid cat"/>
<Title> Stupid Cat pull-down menu V1.0 </title>
<Style type = "text/CSS">
HTML, body {
Background: #000000;
Height: 100%;
Font-size: 12px;
Font-family: Arial, Helvetica, sans-serif;
Color: #333333;
Margin: 20px auto;
Overflow: hidden;
Text-align: center ;}
/* Menu container menu */
Div # menu {
Width: 100%;
Height: 34px;
Padding: 0px 0px 0px 5px ;}
/* Level-1 menu */
Div # menu Div {
Width: 125px;
Height: 20px;
Float: left;
Text-transform: Capitalize;
Background: # cccccc;
Padding: 5px 0px 0px 0px;
Margin: 4px 1px 0px 0px ;}
/* Level-2 menu */
Div # menu Div {
Width: 125px;
Height: 20px;
Border-bottom: 1px #333333 solid;
Background: #666666;
Margin-top:-4px;
Cursor: pointer;
Display: none ;}
/* Special styles in the level-2 menu (optional )*/
Div # menu Div. div1 {
Margin-top: 3px;
Border-top: 1px #333333 solid ;}
</Style>
</Head>
<Body>
<Div id = "menu">
<Div> menu Item1 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div> <div> sub menu3 </div> <div> sub menu4 </div>
<Div> menu item2 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div> <div> sub menu3 </div>>
<Div> menu item3 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div>
<Div> menu item4 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div> <div> sub menu3 </div> <div> sub menu4 </div>
<Div> menu item5 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div> <div> sub menu3 </div>>
<Div> menu item6 <Div class = "div1"> sub menu1 </div> <div> sub menu2 </div> <div> sub menu3 </div>>
</Div>
<SCRIPT type = "text/JavaScript">
VaR menuitem = Document. getelementbyid ("menu"). getelementsbytagname ("Div ");
For (I = 0; I <menuitem. length; I ++ ){
Menuitem [I]. onmouseover = function (){
VaR submenu = This. getelementsbytagname ("Div ");
For (j = 0; j <submenu. length; j ++ ){
Submenu [J]. style. Display = "Block ";
Submenu [J]. onmouseover = function () {This. style. Background = "#999999"; this. style. color = "#000000 ";};
Submenu [J]. onmouseout = function () {This. style. Background = "#666666"; this. style. color = "#333333 ";};}
This. style. Background = "#666666 "};
Menuitem [I]. onmouseout = function (){
VaR submenu = This. getelementsbytagname ("Div ");
For (j = 0; j <submenu. length; j ++ ){
Submenu [J]. style. Display = "NONE ";}
This. style. Background = "# cccccc "};
}
</SCRIPT>
</Body>
</Html>