开启左侧

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

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

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

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

x
<!--城市切换 -->
3 g$ B" V7 ]; p<style type="text/css">
* c; R. V: ?0 d, y$ U1 \) d4 |#city *{ margin:0;padding:0; z-index:1000000; top:0;left:0px; float:left;}# ]9 Z1 w& O8 j, P+ S- b& O2 c3 z) v
#warpper{ position: relative; z-index:1000000; margin-top:20px;}
8 ^  f" E3 A5 e' u, j#city { font:normal 12px Verdana, Arial, Helvetica, sans-serif; text-align:center; z-index:1000000;}! S2 q$ }0 B6 F0 Z/ u- c: Q0 F$ ]
#city a{ cursor:pointer; color:#666}
' y' X: K8 y+ x0 ~8 c% ]' J6 f#city dl{ height:18px; line-height:18px; padding:0 10px;}
' |7 t# I* O* T#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;}
) x; L' |/ n5 c8 ^4 y) E#city dt.over{ position:relative;padding:0 10px 0px 0px; z-index:1000001;color:#FF3300; font-weight:bold; height:20px; }5 N0 A- B) [; O9 M& \
#city li{ float:left; list-style-type:none; margin:0px 5px; width:160px;}, ^* S$ p) i7 }% k1 e1 J$ b, k' H% l  Q
#city #c1 li a{ float:left; list-style-type:none; margin:0px 3px; 0 0 }6 q4 R1 Z9 A  \: K+ N% [- V
#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 X/ F0 l  y  x2 U4 Z
.block{ display:block;}* r/ q7 N" b: q) c% o
.none{ display:none;}! d5 @% L+ \1 ^7 k
</style>" W( f! R" w- u, O4 w8 C5 m
<script language="javascript">
4 H1 j* V5 C) ]! z: m% O! h( q) Afunction $(str){ return document.getElementById(str);}, p% a5 \& ]! v2 w
function $$(str){ return document.getElementsByTagName(str);}
6 J& Z' ?( {, ?3 Rvar timer;
/ v) p& V. {- u+ K( }' Tfunction changeMenu(thisObj,num){9 m$ p! B( @/ u" v) s, m
if(thisObj.className=="over") return false;
9 W- T& R" G4 W8 ?/ W# ehids(thisObj);
' ?" p2 L; o9 L, g- ]( RthisObj.className="over";
7 p1 A  |% _. J3 q$("c"+(num+1)).className="block";
' B' {, G$ f: h
9 Y8 m" U  b! v! E$("c"+(num+1)).onmouseover=function(){clearTimeout(timer);}9 r# s; Q; X' D7 {0 ^) S/ G- B: B
$("c"+(num+1)).onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},500)}4 G# q( A( A- B0 s2 ~- a5 E
thisObj.onmouseout=function(){timer=setTimeout(function(){hids(thisObj);},3000)}  H+ r+ u( t! F/ X' I$ ]3 F% @
- {2 u- @+ q7 g+ b( D" u
}
$ {9 J% K% U% X' [3 X; Zfunction hids(thisObj){
& q/ ~1 e. D& {0 E" @5 PclearTimeout(timer);. y# s3 _9 y% \( H. D4 o
var tabObj=thisObj.parentNode.getAttribute("id");
; W6 Z! [' }+ c, {# [- G( dvar obj_dt=$(tabObj).getElementsByTagName("dt");
% z; }* q7 ^9 T; u: Pfor(var i=0;i<obj_dt.length;i++){
8 m2 ?5 K+ T4 H2 z# _4 e& Xobj_dt.className="normal";2 X( h# o# P9 t$ h& f
$("c"+(i+1)).className="none";
( h+ {. p4 _, o4 r, R3 d+ o}7 ~; P0 g* o( b$ D. p( N
}" f7 e7 B0 C8 r# ~: q( D. J
</script>
( t' A$ R+ R7 ^2 A<div id="city">5 t  x. i) b( u
<dl id="warpper">; ~8 g5 X, _+ f' e& L8 ^
<dt>[北美主要城市]</dt>' Y2 ?: M& M( Q$ @0 `  X$ D4 g
<dd id="c1" class="none">
# t5 Z. w7 z5 r/ q' R<ul>' [4 {1 ]" ?+ b. A6 V
<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>
4 g2 j$ z% i  Y3 v' Z</li>, m* ^+ H2 M  _6 W9 ^' O
</ul>
* v; L3 t. d' u5 q2 d4 N+ x7 T+ m</dd>
& o7 h4 {' Z* U+ V4 p1 E</dl>
% t& D- m" n+ Q4 Q$ E2 z0 ]5 ~  Q
</div>
6 I% x: ]: [6 D1 N% y+ P<!--城市切换_结束-->- Y) `) W1 h; I9 y5 V7 z0 j% o/ d

8 t  z* `& f$ b% H5 L* A5 V/ y) M2 ]+ b% Y


转载请保留当前帖子的链接: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
. x& |$ i; m% r/ R! i0 F+ u( ^! F看到测试结果了。

/ Q$ q, u( x1 R. W各个城市的地产交易查询,可以上线了吗?

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

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

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

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