开启左侧

[学习借鉴] 测试代码:主要城市切换

[复制链接]
发表于 2016-9-15 02:09 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册

x
<!--城市切换 -->4 o5 W. m( K- A8 v8 d  X9 W
<style type="text/css"> 9 `/ h6 {& [" k/ v% h
#city *{ margin:0;padding:0; z-index:1000000; top:0;left:0px; float:left;}3 L& s: x; m& T2 V: Y
#warpper{ position: relative; z-index:1000000; margin-top:20px;}
+ `  `; @1 o& M  u4 t- W; u3 w. C% M#city { font:normal 12px Verdana, Arial, Helvetica, sans-serif; text-align:center; z-index:1000000;}
/ b/ L6 ]! S8 m+ U#city a{ cursor:pointer; color:#666}+ t- {, f8 f: Y" X# |
#city dl{ height:18px; line-height:18px; padding:0 10px;}
: p( w1 G$ T, [+ J1 Y#city dt,.normal{ float:left; padding:0 10px 0 0 ; border-right:0px solid #ccc; text-decoration:none; width:auto; cursor:pointer; color:#FF3300; font-weight:bold;}" S5 V( o' D: Q6 k; P& [9 M
#city dt.over{ position:relative;padding:0 10px 0px 0px; z-index:1000001;color:#FF3300; font-weight:bold; height:20px; }
' k1 m6 V; }* {" d#city li{ float:left; list-style-type:none; margin:0px 5px; width:160px;}+ O& u8 d* N3 B$ c5 R
#city #c1 li a{ float:left; list-style-type:none; margin:0px 3px; 0 0 }; V$ r( z- F: R( e) o" w
#city dl dd{ position:absolute; width:160px; left:0;top:20px!important; border:1px solid #bbb; background:#fff; filter:progidXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, color=#cccccc); padding:3px 0;}* ^9 p& Q& j! y/ O0 S$ ^! k
.block{ display:block;}$ u9 [) t0 e& ~: q! X( N: r
.none{ display:none;}
7 f# I0 R! k0 `& y6 s9 R. v+ M</style>/ Q  C. T- b4 O: _
<script language="javascript"> ( o* d8 O9 K5 ~8 Z* {
function $(str){ return document.getElementById(str);}
0 ?3 c# k# I: r* hfunction $$(str){ return document.getElementsByTagName(str);}
% i- S6 a$ [3 @$ rvar timer;% z" `* J( c/ Z
function changeMenu(thisObj,num){. C3 w. |' m4 W7 W" i
if(thisObj.className=="over") return false;, a8 b; ?& ?* P9 a. j( ~
hids(thisObj);
0 e+ z3 b& w1 t+ \7 |9 I" jthisObj.className="over";
% M2 T# s5 `2 @$("c"+(num+1)).className="block";' W* x6 z% `0 b8 A* d2 p  v

6 {" _  h7 ^$ L- p$("c"+(num+1)).onmouseover=function(){clearTimeout(timer);}
1 z5 C( N/ A/ D) |: N1 i$("c"+(num+1)).onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},500)}
% F; D7 A3 B! ~+ _; ~6 xthisObj.onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},3000)}! @, N' I9 D# K3 F$ b

) o9 Q8 G3 j. ^! C- U/ F}
+ N4 l5 M8 Y# c/ `5 i( m7 |function hids(thisObj){
- k  ?" T8 q; g/ fclearTimeout(timer);
' d" t! ?* h% R' Bvar tabObj=thisObj.parentNode.getAttribute("id");5 ?$ x5 T3 O8 ?2 V
var obj_dt=$(tabObj).getElementsByTagName("dt");7 F0 r( m6 ]2 z) C5 `$ ^% t
for(var i=0;i<obj_dt.length;i++){# {2 E1 ~/ J/ b3 f
obj_dt.className="normal";* `6 v; J3 |, T: C% R% [8 y8 g" \
$("c"+(i+1)).className="none";
7 l9 f% H+ U% B$ _/ V8 l}
1 ]% h" H3 A8 Q! x6 G6 O( n}4 t7 `" {5 Z+ ^
</script>
( M4 k9 @/ G0 J1 Q( [<div id="city">( w& e# p$ j5 O* f; E7 t3 r
<dl id="warpper">
- Z' }4 I7 A/ f- i$ n) ?5 r<dt>[北美主要城市]</dt>, a: `  A$ j3 F" y+ a3 d
<dd id="c1" class="none">
  p2 k% y' g5 [" m: ^) F" ]* F7 s<ul>- g* m$ w' H8 g5 [" J6 v8 S
<li><a href="xxx.html">洛杉矶</a> <a href="xxx.html">尔湾</a> <a href="xxx.html">旧金山</a> <a href="xxx.html">圣地亚哥</a> <a href="xxx.html">圣何塞</a> <a href="xxx.html">西雅图</a> <a href="xxx-1.html">纽约</a> <a href="xxx-1.html">波特兰</a> <a href="xxxx.html">奥兰多</a> <a href="xxxx.html">波士顿</a> <a href="xxxx.html">温哥华</a> <a href="xxxx.html">多伦多</a> <a href="xxxx.html">卡尔加里</a> <a href="xxxx.html">蒙特利尔</a>
2 K6 r# I3 ]  H7 _) \  X</li>1 }6 h6 K" N  ?
</ul>8 f0 i! L( {( o: \8 L/ w
</dd>' z" Y2 `) o- ]8 w+ d$ @3 D
</dl>- Z/ ~* |  O& r6 l' v" S
% j1 e& {- ]9 R1 W  P! N4 p" m
</div>5 o% f/ P5 f6 k# T6 E
<!--城市切换_结束-->6 S+ `: o. Y& V6 P
' S: Y4 }! I% S% n$ C
5 p- b' x: b9 j' I/ h0 O


转载请保留当前帖子的链接:https://www.beimeilife.com/thread-30675-1-1.html 谢谢
发表于 2016-9-15 11:45 | 显示全部楼层
看到测试结果了。

点评

各个城市的地产交易查询,可以上线了吗?  详情 回复 发表于 2016-9-16 12:14
发表于 2016-9-16 12:14 | 显示全部楼层
http://www.beimeilife.com/forum.php?mod=redirect&goto=findpost&pid=55897&ptid=30675
, h  ~. @8 B1 ^8 k* P1 t看到测试结果了。
' j$ S8 U' C1 S. R& a! V
各个城市的地产交易查询,可以上线了吗?

使用高级回帖 (可批量传图、插入视频等)快速回复

您需要登录后才可以回帖 登录 | 注册

本版积分规则   Ctrl + Enter 快速发布  

发帖时请遵守我国法律,网站会将有关你发帖内容、时间以及发帖IP地址等记录保留,只要接到合法请求,即会将信息提供给有关政府机构。
快速回复 返回顶部 返回列表