<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Classic Luxury Gallery | www.csstemplateheaven.com</title> <mce:style><!-- .box{width:600px; padding:10px; height:auto; overflow:hidden; text-align:center;margin-top: 10px;} .box span{ line-height:30px; height:30px;white-space:nowrap; display:inline-block; cursor:pointer} .box a,.box a:hover{ padding:10px;color:#fff; line-height:16px;font-weight:bold; font-size:14px;text-decoration:none; position:relative; border:0;} .box a:hover{ border:2px #09e solid;padding:8px;} --></mce:style><style mce_bogus="1"> .box{width:600px; padding:10px; height:auto; overflow:hidden; text-align:center;margin-top: 10px;} .box span{ line-height:30px; height:30px;white-space:nowrap; display:inline-block; cursor:pointer} .box a,.box a:hover{ padding:10px;color:#fff; line-height:16px;font-weight:bold; font-size:14px;text-decoration:none; position:relative; border:0;} .box a:hover{ border:2px #09e solid;padding:8px;} </style> </head> <body> <fieldset> <legend>超市物资大类</legend> <div class="box"> <span><a name="box" href="#" mce_href="#">60--杂品</a></span><span><a name="box" href="#" mce_href="#">52--管道配件</a></span> <span><a name="box" href="#" mce_href="#">51--工矿配件</a></span><span><a name="box" href="#" mce_href="#">54--内燃机机拖拉机配件</a></span> <span><a name="box" href="#" mce_href="#">58--其他机械配件</a></span><span><a name="box" href="#" mce_href="#" >53--密封件</a></span> <span><a name="box" href="#" mce_href="#">57--铁路、水路设备及器材</a></span><span><a name="box" href="#" mce_href="#">50--纺织器材及配件</a></span> <span><a name="box" href="#" mce_href="#" >49--炼化专用设备配件</a></span><span><a name="box" href="#" mce_href="#" >47--石油专用工具</a></span> <span><a name="box" href="#" mce_href="#">59--包装物</a></span><span><a name="box" href="#" mce_href="#" >48--石油专用设备配件</a></span> <span><a name="box" href="#" mce_href="#" >46--其他机械设备</a></span><span><a name="box" href="#" mce_href="#" >45--消防器材</a></span> <span><a name="box" href="#" mce_href="#" >44--阀门</a></span><span><a name="box" href="#" mce_href="#" >56--一般汽车及摩托车配件</a></span> <span><a name="box" href="#" mce_href="#" >55--重型汽车配件</a></span><span><a name="box" href="#" mce_href="#" >43--轴承</a></span> <span><a name="box" href="#" mce_href="#" >42--紧固件</a></span><span><a name="box" href="#" mce_href="#" >41--焊接材料</a></span> <span><a name="box" href="#" mce_href="#" >40--工具、量具、刃具、磨具</a></span><span><a name="box" href="#" mce_href="#" >39--小型机械</a></span> <span><a name="box" href="#" mce_href="#" >38--通用仪器、仪表</a></span><span><a name="box" href="#" mce_href="#">37--石油专用仪器、仪表</a></span> <span><a name="box" href="#" mce_href="#">36--电子工业产品</a></span> </div> <mce:script type="text/javascript"><!-- function randomColor() { //16进制方式表示颜色0-F var arrHex = ["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"]; var strHex = "#"; var index; for(var i = 0; i < 6; i++) { //取得0-15之间的随机整数 index = Math.round(Math.random() * 15); strHex += arrHex[index]; } return strHex; } function changeColor(){ var links = document.getElementsByTagName("a"); for(var i=0;i<links.length;i++){ if(links[i].name == 'box'){ var bgColor = randomColor(); //改变背景色的代码,根据修去修改。 links[i].style.backgroundColor = bgColor; } } } function sayHi(){ var scolor,links = document.getElementsByTagName("a"); for(var i=0;i<links.length;i++){ if(links[i].name == 'box'){ links[i].onmouseover = function(){ scolor = this.style.backgroundColor; this.style.color = scolor; this.style.borderColor = scolor; this.style.backgroundColor = "white"; } links[i].onmouseout = function(){ this.style.color = "white"; this.style.borderColor = ""; this.style.backgroundColor = scolor; } links[i].onmousedown = function(){ alert('你选择的印象是 "'+this.childNodes[0].nodeValue+'"'); //window.location.href="shop.html"; } } } } changeColor(); sayHi(); // --></mce:script> </fieldset> </body> </html>