开启左侧

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

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

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

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

x
<!--城市切换 -->/ }+ A" W" W4 c! Q* ^
<style type="text/css"> % y" b* @8 {' a( y4 N2 N
#city *{ margin:0;padding:0; z-index:1000000; top:0;left:0px; float:left;}7 Y1 H; J% q1 E: [, d
#warpper{ position: relative; z-index:1000000; margin-top:20px;}
9 F  Z6 o+ {  ~2 ^- `; c/ o' M8 m" w#city { font:normal 12px Verdana, Arial, Helvetica, sans-serif; text-align:center; z-index:1000000;}
6 P' N% N, e7 b2 }#city a{ cursor:pointer; color:#666}
& D4 E$ F, ?6 V+ g3 Q#city dl{ height:18px; line-height:18px; padding:0 10px;}
' D. N$ ^5 z) p2 B  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;}
4 S: @/ s8 K' Y. r2 y5 H#city dt.over{ position:relative;padding:0 10px 0px 0px; z-index:1000001;color:#FF3300; font-weight:bold; height:20px; }
( E+ `8 m, V1 x3 Z0 z#city li{ float:left; list-style-type:none; margin:0px 5px; width:160px;}
- i9 k: R& H' i2 u#city #c1 li a{ float:left; list-style-type:none; margin:0px 3px; 0 0 }) f3 j( ^1 g8 E1 K
#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;}! K9 r) [' ~" a) d
.block{ display:block;}
, F  d/ R2 ^4 z& P0 P.none{ display:none;}% c) C! v" @6 W' |% R
</style>
0 H  U* |; Q8 \5 k6 j' o) ^* L, R<script language="javascript">
: X  @% O. H! ?1 o5 D" qfunction $(str){ return document.getElementById(str);}
5 n% h% P% H1 e6 u7 P  lfunction $$(str){ return document.getElementsByTagName(str);}
9 s7 D/ q& b, j& ~" _' c/ dvar timer;1 y4 \$ ]" l5 {, L% W
function changeMenu(thisObj,num){! I+ Q8 P: S3 `# p# o) y; o) j
if(thisObj.className=="over") return false;$ H. C; w9 M% n! e& Q+ }: n
hids(thisObj);
, D6 B- ]8 C3 R( T% E2 othisObj.className="over";1 N3 {. E; T3 c
$("c"+(num+1)).className="block";: q, i" W2 w( ]2 j/ }) v

- l9 _( v# w5 b, U3 z$("c"+(num+1)).onmouseover=function(){clearTimeout(timer);}5 w; E8 _8 _# M' b/ O
$("c"+(num+1)).onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},500)}  E  K1 l: Y0 l0 Z5 y' Y/ J
thisObj.onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},3000)}
  @# F9 T& C( F) ^7 m
. j5 a0 g% {6 i9 n; E) Z" `) r}7 z! \0 F5 n; v( {  _
function hids(thisObj){' @# k4 `) v2 p7 u; e1 D. _. g3 L- o
clearTimeout(timer);
: X% b# Q- Y4 hvar tabObj=thisObj.parentNode.getAttribute("id");
. S* ?9 ^! C; ^! C* Q0 mvar obj_dt=$(tabObj).getElementsByTagName("dt");2 i. [0 M: H2 X, C- }+ O
for(var i=0;i<obj_dt.length;i++){9 }* H, a9 ^1 }  J" T
obj_dt.className="normal";8 ~4 Y) Q0 A. R0 }4 n( V; L6 ~5 L  r
$("c"+(i+1)).className="none";
  r# J1 h0 M+ @8 v  V% l/ E1 ^/ N}
3 [: S0 Z/ e8 f) k}5 e) c- w6 Z; V7 X6 v/ n9 W. h
</script>
! V) _) v, t; a, ^/ K<div id="city">" A8 r# v& ~0 H) L: V
<dl id="warpper">* B& X! r. \. Z0 M
<dt>[北美主要城市]</dt>0 B* V# F- E- \- O2 @! Q; H/ s* e
<dd id="c1" class="none">
- a. m3 }; _5 P# k$ Y. ]+ J$ @<ul>
' F1 A# a6 {! h, E, z: E6 [<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>
- U, v- I4 Z9 [# M</li>
: \! ?3 n- v! a2 [5 N# Y  Q</ul>
2 e8 K: _" W- u  Y% _! E</dd>
7 {. G# g( f  H7 c0 r</dl>2 c7 t: L4 X1 L* N! I) p
5 v0 p1 P4 G7 ?6 y& X! O& X
</div>
7 b8 x) \) ^  H3 `6 `, ~4 T<!--城市切换_结束-->
" w# c8 s/ c1 ]' m4 [- h9 \* W" L( `& H

$ |7 p3 ~/ ?  }# d! a/ }& G/ N


转载请保留当前帖子的链接: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=306752 D* U3 M: H4 O0 e4 L9 }
看到测试结果了。

! d& G0 m2 r7 L% p9 c! u; z各个城市的地产交易查询,可以上线了吗?

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

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

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

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