XMU-CHINA/Temp/titlebar
From 2012.igem.org
(Difference between revisions)
Line 1: | Line 1: | ||
+ | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | ||
<html xmlns="http://www.w3.org/1999/xhtml"> | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
<head> | <head> | ||
- | <meta http-equiv="Content-Type" content="text/html; charset= | + | <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> |
- | + | <script type=text/javascript><!--//--><![CDATA[//><!-- | |
- | <script | + | function menuFix() { |
- | < | + | var sfEls = document.getElementById("menu").getElementsByTagName("li"); |
- | + | for (var i=0; i<sfEls.length; i++) { | |
- | + | sfEls[i].onmouseover=function() { | |
- | + | this.className+=(this.className.length>0? " ": "") + "sfhover"; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | sfEls[i].onMouseDown=function() { | |
- | + | this.className+=(this.className.length>0? " ": "") + "sfhover"; | |
+ | } | ||
+ | sfEls[i].onMouseUp=function() { | ||
+ | this.className+=(this.className.length>0? " ": "") + "sfhover"; | ||
+ | } | ||
+ | sfEls[i].onmouseout=function() { | ||
+ | this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"), | ||
+ | ""); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | window.onload=menuFix; | ||
+ | //--><!]]></script> | ||
+ | <style type="text/css"> | ||
+ | body { font-family: Verdana; font-size: 12px; line-height: 1.5; } | ||
+ | a { color: #000; text-decoration: none; } | ||
+ | a:hover { color: #F00; } | ||
+ | #menu { width:500px; height:28px; margin:0 auto; border-bottom:3px solid #E10001;} | ||
+ | #menu ul { list-style: none; margin: 0px; padding: 0px; } | ||
+ | #menu ul li { float:left; margin-left:2px;} | ||
+ | #menu ul li a { display:block; width:87px; height:28px; line-height:28px; text-align:center; background:url(http://www.aa25.cn/upload/2010-06/27/nav_bg2.gif) 0 0 no-repeat; font-size:14px;} | ||
+ | #menu ul li a:hover { background:url(http://www.aa25.cn/upload/2010-06/27/nav_bg3.gif) 0 0 no-repeat;} | ||
+ | #menu ul li a#current { background:url(http://www.aa25.cn/upload/2010-06/27/nav_bg1.gif) 0 0 no-repeat; font-weight:bold; color:#fff;} | ||
+ | #menu ul li ul { border:1px solid #ccc; display:none; position:absolute;} | ||
+ | #menu ul li ul li { float:none; width:87px; background:#eee; margin:0;} | ||
+ | #menu ul li ul li a { background:none;} | ||
+ | #menu ul li ul li a:hover { background:#333; color:#ff0;} | ||
+ | #menu ul li:hover ul { display:block;} | ||
+ | #menu ul li.sfhover ul { display:block;} | ||
</style> | </style> | ||
- | |||
</head> | </head> | ||
- | |||
<body> | <body> | ||
- | < | + | <div id="menu"> |
- | + | <ul> | |
- | + | <li><a id="current" href="#">Home</a></li> | |
- | + | <li><a href="#">Team</a> | |
- | + | <ul> | |
- | + | <li><a href="#">1</a></li> | |
- | + | <li><a href="#">2</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li><a href="#">3</a> | |
- | + | <ul> | |
- | + | <li><a href="#">4</a></li> | |
- | + | <li><a href="#">5</a></li> | |
- | + | <li><a href="#">6</a></li> | |
- | + | </ul> | |
- | + | </li> | |
- | + | <li><a href="#">7</a></li> | |
- | + | <li><a href="#">8</a></li> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
</ul> | </ul> | ||
- | + | </div> | |
- | <div | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 01:09, 5 August 2012
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">