本帖最后由 国狼策略 于 2010-6-21 00:49 编辑
我找到一个很不错的城市切换代码,但是谁能把他整合的DZ上,和19lou的那个很像呢?有没有什么简单的办法实现呢!高人请实验下吧~
弄好了给大家免费分享,谢谢了!
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>仿19lou效果</title>
- <style type="text/css">
- *{ margin:0;padding:0;}
- body{ font:normal 12px Verdana, Arial, Helvetica, sans-serif; text-align:center;}
- #warpper{ position:absolute; left:500px; top:60px;}
- h5{ float:left;}
- a{ text-decoration:underline; cursor:pointer; font-weight:bold;}
- dl{ height:18px; line-height:18px; background:#f7f7f7; padding:0 10px;}
- dt,.normal{ float:left; padding:0 10px; border-right:1px solid #ccc; text-decoration:none; width:auto; cursor:pointer;}
- dt.over{ position:relative;border:1px solid #86e5f0; padding:0 10px 15px 10px; border-bottom:1px solid #caf1f1; margin:-1px 0 0 -1px; z-index:1000; color:#ff6026; text-decoration:underline; background:#caf1f1; height:12px; }
- li{ float:left; list-style-type:none; margin:5px 10px; width:120px;}
- dl dd{ position:absolute; width:200px; left:0;top:17px!important; border:1px solid #86e5f0; background:#caf1f1; filter:progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, color=#cccccc); padding:10px 0;}
- .block{ display:block;}
- .none{ display:none;}
- </style>
- <script language="javascript">
- function $(str){ return document.getElementById(str);}
- function $$(str){ return document.getElementsByTagName(str);}
- var timer;
- function changeMenu(thisObj,num){
- if(thisObj.className=="over") return false;
- hids(thisObj);
- thisObj.className="over";
- $("c"+(num+1)).className="block";
-
- $("c"+(num+1)).onmouseover=function(){clearTimeout(timer);}
- $("c"+(num+1)).onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},500)}
- thisObj.onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},3000)}
-
- }
- function hids(thisObj){
- clearTimeout(timer);
- var tabObj=thisObj.parentNode.getAttribute("id");
- var obj_dt=$(tabObj).getElementsByTagName("dt");
- for(var i=0;i<obj_dt.length;i++){
- obj_dt[i].className="normal";
- $("c"+(i+1)).className="none";
- }
- }
- </script>
- </head>
- <body>
- <dl id="warpper">
- <dt>选择城市</dt>
- <dd id="c1" class="none">
- <ul>
- <li><a href="#">北京</a> <a href="#">上海</a> <a href="#">南京</a> <a href="#">杭州</a> <a href="#">武汉</a> <a href="#">小日本</a> <a href="#">费力比</a>
- </Font>
- </li>
- </ul>
- </dd>
- </dd>
- </dl>
- </body>
- </html>
复制代码
city.rar
(1.28 KB, 下载次数: 1450)
|