<!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>仿雅虎首页网站快捷入口和快</title>
<style>
*{ margin:0; padding:0; border:none;}
body{font:12px/130% verdana,geneva,arial,helvetica,sans-serif; height:100%;}li{list-style:none;}
html{ height:100%;}
.clearfix:after{content:
" "
;display:block;height:0;clear:both;visibility:hidden;}.clearfix{display:inline-block;}
a:link{ color:
#000; text-decoration:none; }
a:visited{ color:
#000; text-decoration:none; }
a:hover{ color:
#000; text-decoration:none; }
.rrow{width:224px;}
.login{ background:url(images/box.png); height:210px;width:224px; overflow:hidden;}
.login h2{ color:
#fff; font-size:14px; padding:4px 12px; line-height: 30px;height:24px; overflow:hidden; }
.login h2 span{ font-size:12px; float:right;margin:-31px 23px 0 0;line-height: 32px;font-weight:400; cursor:pointer;}
.rrow ul{ margin:5px 6px; }
.rrow ul li {width:216px; height:31px;margin-bottom: 5px; overflow:hidden; float:left;}
.rrow ul li a,.rrow ul li span{ cursor:pointer; display:block; float:left; margin-right: 4px; background:url(images/title.gif) 0 -152px; width:69px;padding-left:35px; height:31px; overflow:hidden; line-height: 32px; font-weight:700;}
.rrow ul li .lhover{ display:block; float:left; margin-right: 4px; background:url(images/title.gif) 0 -183px; width:69px;padding-left:35px; height:37px; overflow:hidden; line-height: 32px; font-weight:700;}
.rrow ul li .yhzc{ background:url(images/title.gif) 0 -152px;}
#yhzc{background:url(images/title.gif) 0 -183px;height:37px;}
.rrow ul li .hysj{ background:url(images/title.gif) -104px -152px; }
#hysj{ background:url(images/title.gif) -104px -183px;height:37px;}
.rrow ul li .fbxx{ background:url(images/title.gif) 0 -220px; }
#fbxx{ background:url(images/title.gif) 0 -251px;height:37px;}
.rrow ul li .gstg{ background:url(images/title.gif) -104px -220px; }
#gstg{ background:url(images/title.gif) -104px -251px;height:37px;}
.rrow ul li .xzmj{ background:url(images/title.gif) 0 -288px; }
#xzmj{ background:url(images/title.gif) 0 -319px;height:37px;}
.rrow ul li .bzzx{ background:url(images/title.gif) -104px -288px; }
#bzzx{ background:url(images/title.gif) -104px -319px;height:37px;}
.rrow ul .hoverli{background:url(images/title.gif) 0 -357px;height:92px; overflow:hidden; line-height: 32px; font-weight:700;}
.qlogin{height:92px; width:210px; line-height: 32px; margin:5px 0 0 10px; display:none;}
.qlogin dt{ height:0; overflow:hidden; }
.qlogin dd{ padding:4px; width:210px; height:22px; text-align:left; float:left;clear:both;overflow:hidden;}
.qlogin dd .passw,.qlogin a:hover.passw{ margin: -4px 12px 0 0; float:right;}
.rrow ul li div{ margin-top: 5px; width:210px; display:none;}
.rrow ul li div a,.rrow ul li div a:hover{background:url(images/title.gif) -80px -1px; height:20px; line-height: 20px; clear:both; font-weight: 400; width:170px;}
.rrow ul li div a:hover{ text-decoration:underline; }
.rrow ul li .block,.rrow .block{ display:block; }
.rrow ul .none{ display:none; }
.btn{font-size:12px; font-family:宋体; float:left; width:57px; height:20px; overflow:hidden; background:url(images/title.gif); line-height: 21px;padding-left:18px;margin-right: 10px; }
a:hover.btn{background:url(images/title.gif) 0 -20px;}
#btn4{background:url(images/title.gif);width:75px; margin-left: 48px; cursor:pointer;}
.input2{font-size:12px; border:1px solid
#999; width:140px; height:16px; padding:1px 2px 0 2px; }
</style>
</head>
<body>
<table width=
"18%"
height=
"420"
border=
"0"
align=
"center"
cellpadding=
"0"
cellspacing=
"0"
>
<tr>
<td><div class=
"rrow"
>
<div id=
"login"
class=
"login"
>
<h2>便捷入口<span><a class=
"w"
title=
"快速登陆"
>快速登陆</a></span></h2>
<dl class=
"qlogin clearfix"
>
<dt>快速登陆</dt>
<dd>用户名:
<input name=
"text"
type=
"text"
class=
"input2"
/>
</dd>
<dd>密 码:
<input name=
"password"
type=
"password"
class=
"input2"
/>
</dd>
<dd>
<input name=
"submit"
type=
"submit"
class=
"btn"
id=
"btn4"
value=
"立即登陆"
/>
<a class=
"passw"
href=
"#"
target=
"_blank"
>忘记密码?</a></dd>
</dl>
<ul>
<li id=
"btype1"
class=
"hoverli"
><span class=
"yhzc"
id=
"yhzc"
href=
"#"
target=
"_blank"
title=
"用户注册"
>用户注册</span><span class=
"hysj"
href=
"#"
target=
"_blank"
title=
"会员升级"
>会员升级</span>
<div class=
"block"
><a href=
"#"
target=
"_blank"
>1...</a><a href=
"#"
target=
"_blank"
>1...</a></div>
<div><a href=
"#"
target=
"_blank"
>2...</a><a href=
"#"
target=
"_blank"
>2...</a></div>
</li>
<li id=
"btype2"
><span class=
"fbxx"
href=
"#"
target=
"_blank"
title=
"发布信息"
>发布信息</span><span class=
"gstg"
href=
"#"
target=
"_blank"
title=
"公司推广"
>公司推广</span>
<div><a href=
"#"
target=
"_blank"
>3...</a><a href=
"#"
target=
"_blank"
>3...</a></div>
<div><a href=
"#"
target=
"_blank"
>4...</a><a href=
"#"
target=
"_blank"
>4...</a></div>
</li>
<li id=
"btype3"
><span class=
"xzmj"
href=
"#"
target=
"_blank"
title=
"寻找买家"
>寻找买家</span><span class=
"bzzx"
href=
"#"
target=
"_blank"
title=
"帮助中心"
>帮助中心</span>
<div><a href=
"#"
target=
"_blank"
>5...</a><a href=
"#"
target=
"_blank"
>5...</a></div>
<div><a href=
"#"
target=
"_blank"
>6...</a><a href=
"#"
target=
"_blank"
>6...</a></div>
</li>
</ul>
</div>
<script type=text/javascript>
var
login = document.getElementById(
"login"
);
var
yhzc = document.getElementById(
"yhzc"
);
var
h2 = login.getElementsByTagName(
"h2"
);
var
dl = login.getElementsByTagName(
"dl"
);
var
ul = login.getElementsByTagName(
"ul"
);
var
lis = ul[0].getElementsByTagName(
"li"
);
var
allspan = ul[0].getElementsByTagName(
"span"
);
var
qlog = h2[0].getElementsByTagName(
"a"
);
var
divs = login.getElementsByTagName(
"div"
);
qlog[0].onclick =
function
()
{
for
(
var
i = 0; i < divs.length; i++)
{divs[i].className =
null
;}
for
(
var
i = 0; i < allspan.length; i++)
{allspan[i].id =
null
;}
lis[0].className =
"none"
;
dl[0].className =
"qlogin block"
;
}
for
(
var
x = 1; x < 4; x++)
{show();}
function
show()
{
var
test =
"btype"
+x;
var
btype = document.getElementById(
"btype"
+ x);
var
as = btype.getElementsByTagName(
"a"
);
var
bdivs = btype.getElementsByTagName(
"div"
);
var
spans = btype.getElementsByTagName(
"span"
);
for
(
var
i = 0; i < spans.length; i++)
{
spans[i].num = i;
spans[i].onmouseover = type;
}
function
type()
{
for
(
var
i = 0; i < lis.length; i++)
{lis[i].className =
null
;}
for
(
var
i = 0; i < allspan.length; i++)
{allspan[i].id =
null
;}
for
(
var
i = 0; i < divs.length; i++)
{divs[i].className =
null
;}
dl[0].className =
"qlogin"
;
yhzc.id =
null
;
spans[
this
.num].id = spans[
this
.num].className;
bdivs[
this
.num].className =
"block"
;
btype.className =
"hoverli"
;
}
}
</script>
</div>
</td>
</tr>
</table>
</body>
</html>