***页面特效***菜单平时隐藏着,鼠标移到特定地方就会显现 (像oicq)
把下列代码加到网页的<body></body>标签之间 从google下载我的照片管理软件要完成此效果需要三个步骤
第一步:把如下代码加入到<head>区域中
<style>#d1 {
background-color: blue;
border-bottom: white 2px outset;
border-left: white 2px outset;
border-right: white 2px outset;
border-top: white 2px outset;
left: 0px; position: absolute;
top: 0px; visibility: hidden;
width: 300px;
layer-background-color: lightgreen
}
a{font-size:9pt}
a:link{text-decoration:none}
a:hover{text-decoration:none;color:#ffffff}
a:visited{text-decoration:none}
.40pt{font-size:40pt;color:#ub39a1;font-family:文鼎琥珀繁}
</style>
<script language="javascript">
function menuin() //菜单隐藏
{
if(n4) {
cleartimeout(out_id)
if( menu.top > menuh*-1+20+10 ) {
menu.top -= 8
in_id = settimeout("menuin()", 1)
}
else if( menu.top > menuh*-1+20 ) {
menu.top--
in_id = settimeout("menuin()", 1)
}
}
else {
cleartimeout(out_id)
if( menu.pixeltop > menuh*-1+20+10 ) {
menu.pixeltop -= 8
in_id = settimeout("menuin()", 1)
}
else if( menu.pixeltop > menuh*-1+20 ) {
menu.pixeltop--
in_id = settimeout("menuin()", 1)
}
}
}
function menuout() //菜单显示
{
if(n4) {
cleartimeout(in_id)
if( menu.top < -10) {
menu.top += 4
out_id = settimeout("menuout()", 1)
}
else if( menu.top < 0) {
menu.top++
out_id = settimeout("menuout()", 1)
}
}
else {
cleartimeout(in_id)
if( menu.pixeltop < -10) {
menu.pixeltop += 2
out_id = settimeout("menuout()", 1)
}
else if( menu.pixeltop < 0 ) {
menu.pixeltop++
out_id = settimeout("menuout()", 1)
}
}
}
function fireover() {
cleartimeout(f_out)
f_over = settimeout("menuout()", 10)
}
function fireout() {
cleartimeout(f_over)
f_out = settimeout("menuin()", 10)
}
function init() {
if(n4) {
menu = document.d1
menuh = menu.document.height
menu.top = menu.document.height*-1+20
menu.onmouseover = menuout
menu.onmouseout = menuin
menu.visibility = "visible"
}
else if(e4) {
menu = d1.style
menuh = d1.offsetheight
d1.style.pixeltop = d1.offsetheight*-1+20
d1.onmouseover = fireover
d1.onmouseout = fireout
d1.style.visibility = "visible"
}
}
f_over=f_out=in_id=out_id=null
n4 = (document.layers)?1:0
e4 = (document.all)?1:0;
</script>
第二步:把如下代码加入到<body>区域中
<div id="d1">
<table border="0" width="100%">
<tbody>
<tr>
<td align="middle" bgcolor="ub39a1" rowspan="2"><b style="color: ub39a1">
m<br>
e<br>
n<br>
u</b></td>
<td> <br><br><ul>
<li><a href="link.htm">
选 项 1</a>
</li>
<li><a href="link.htm">
选 项 2</a>
</li>
<li><a href="link.htm">
选 项 3</a>
</li>
<li><a href="link.htm">
选 项 4</a>
</li>
<li><a href="link.htm">
选 项 5</a>
</li>
</ul>
</td>
<td><br><br><ul>
<li><a href="link.htm">
选 项 6</a>
</li>
<li><a href="link.htm">
选 项 7</a>
</li>
<li><a href="link.htm">
选 项 8</a>
</li>
<li><a href="link.htm">
选 项 9</a>
</li>
<li><a href="javascript:void(0)">
选 项 10</a>
</li>
</ul>
</td>
</tr>
<tr>
<td align="right" colspan="2">
</td>
</tr>
</tbody>
</table>
</div>
第三步:把“onload="init()"”加在<body>标记里
例如:<body onload="init()"
----- ---------------------------------
拥有三人行 论坛管理系列软件,一个人就可以管理一个论坛的更新维护。还能使您的论坛有千人在线的真实火暴效果,让 您不在为论坛因没有人气而留不住会员而烦恼,使您的论坛早日成为一流的论坛。详情请登陆网站:ht tp://www.cn srx.cn三人行论坛管理软件,站长必备的专业好工具。(您使用的 是 免费版本,购买收费版本后,将不带广告。业务QQ: 247216 44985227)
页:
[1]