首页 > 代码库 > 用JS代码修饰出来的有立体感的按钮式竖向文字菜单
用JS代码修饰出来的有立体感的按钮式竖向文字菜单
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>用JS代码修饰出来的有立体感的按钮式竖向文字菜单丨</TITLE> </HEAD> <BODY> <STYLE type=text/css>A:link { TEXT-DECORATION: none } A:visited { TEXT-DECORATION: none } A:active { TEXT-DECORATION: none } A:hover { TEXT-DECORATION: none } .up { BORDER-RIGHT: #711200 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: white 1px solid; PADDING-LEFT: 1px; FONT-SIZE: 9pt; PADDING-BOTTOM: 1px; BORDER-LEFT: white 1px solid; COLOR: #ff0000; PADDING-TOP: 1px; BORDER-BOTTOM: #711200 1px solid; FONT-FAMILY: Tahoma; BACKGROUND-COLOR: #eadfd0 } </STYLE> <SCRIPT language=JavaScript> <!-- IE and NS6 Menu Button script kurt.grigg@virgin.net if (!document.layers){ // Choose size and colours here! Width=100; Font=‘Verdana‘; FontSize=9; AFontColor=‘#000000‘; BFontColor=‘red‘; CFontColor=‘#ffffff‘; down="#6699cc"; FontWeight=‘normal‘; //normal or bold! BackGround=‘#99ccff‘; //Same as your body bgcolor! BorderDepth=2; BorderLight=‘#FFFFFF‘; BorderShad=‘#000000‘; //Nothing needs altering past here!!!!!!!!!!!!!!!!!!!!!! function On(id){ with(id.style){ color=BFontColor; borderTopColor=BorderLight; borderLeftColor=BorderLight; borderRightColor=BorderShad; borderBottomColor=BorderShad; } } function Off(id){ with(id.style){ color=AFontColor; borderTopColor=BackGround; borderLeftColor=BackGround; borderRightColor=BackGround; borderBottomColor=BackGround; background=BackGround; } } function Down(id){ with(id.style){ color=CFontColor; borderTopColor=BorderShad; borderLeftColor=BorderShad; borderRightColor=BorderLight; borderBottomColor=BorderLight; background=down; } } function Link(Url,Txt,target){ document.write("<a href=http://www.mamicode.com/‘"+Url+"‘ target=‘"+target+"‘>" +"<div style=‘position:relative;" +"width:"+Width+"px;height:"+FontSize+"px;" +"border-width:"+BorderDepth+"px;" +"border-color:"+BackGround+";" +"border-style:solid;" +"padding:"+FontSize/4.5+"pt;" +"background:"+BackGround+";" +"font-family:"+Font+";" +"font-size:"+FontSize+"pt;" +"line-height:"+FontSize*1.2+"pt;" +"font-weight:"+FontWeight+";" +"text-align:left;" +"color:"+AFontColor+";" +"margin-top:2px;" +"cursor:hand‘" +"onMouseOver=‘javascript:On(this)‘" +"onMouseOut=‘javascript:Off(this)‘" +"onMouseDown=‘javascript:Down(this)‘>" +Txt+"</div></a>"); } } function Temp(){ alert("TEST"); } //--> </SCRIPT> <!-- End Menu Buttons Part:1 --><!-- Menu Buttons Part:2 Paste in Body where needed --> <SCRIPT language=JavaScript> <!-- if (!document.layers){ if (document.getElementById&&!document.all){ document.write("<div style=‘position:relative‘>" +"<table border=‘0‘ cellpadding=‘0‘ cellspacing=‘0‘>" +"<tr><td valign=‘top‘>"); } Link(‘http://www.baidu.com‘,‘百度一下‘,‘_blank‘); Link(‘http://www.yahoo.com‘,‘Yahoo‘,‘_blank‘); Link(‘http://www.google.com‘,‘Google‘,‘_blank‘); Link(‘http://www.jxztbz.net/‘,‘纸筒‘,‘_blank‘); Link(‘http://www.163.com‘,‘网易‘,‘main‘); if (document.getElementById&&!document.all){ document.write("</td></tr></table></div>"); } } //--> </SCRIPT> </BODY> </HTML> <br><br><hr>
用JS代码修饰出来的有立体感的按钮式竖向文字菜单
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。