站点首页 | 实用文章 | 考试相关 | 论文中心 | 故事小说 | 教程中心
热门文章
搜索
您现在的位置: hglm >> 教程中心 >> 网页制作 >> Javascript >> 教程正文
JavaScript特效源代码 - 缓慢打开的文本下拉菜单

在网页的HEAD中加入以下的代码信息即可:

<style>
<!--
#iewrap{
position:relative;
height:30px
}

#iewrap2{
position:absolute
}

#dropmenu03{
filter:revealTrans(Duration=1.5,Transition=12)
visibility:hide
}
-->
</style>

然后在网页的BODY中加入以下的代码信息:

<ilayer id="dropmenu01" height=35px>
<layer id="dropmenu02" visibility=show>
<span id="iewrap">
<span id="iewrap2" onClick="dropit2();event.cancelBubble=true;return false">
<font face="宋体"><a href="#">友情连接</a></font>
</span>
</span>
</layer>
</ilayer>

<SCRIPT language=javascript><!--
var enableeffect=true

//修改以下为你自己的信息
var selection=new Array()
selection[0]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[1]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[2]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[3]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[4]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[5]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[6]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font><br>'
selection[7]='<font face="宋体"><a href="http://www.51step.net/">我要起步</a></font>'

if (document.layers)
document.dropmenu01.document.dropmenu02.visibility='show'

function dropit2(){
if (document.all){
dropmenu03.style.left=document.body.scrollLeft+event.clientX-event.offsetX
dropmenu03.style.top=document.body.scrollTop+event.clientY-event.offsetY+18
if (dropmenu03.style.visibility=="hidden"){
if (enableeffect)
dropmenu03.filters.revealTrans.apply()
dropmenu03.style.visibility="visible"
if (enableeffect)
dropmenu03.filters.revealTrans.play()
}
else{
hidemenu()
}
}
}

function dropit(e){
if (document.dropmenu03.visibility=="hide")
document.dropmenu03.visibility="show"
else
document.dropmenu03.visibility="hide"
document.dropmenu03.left=e.pageX-e.layerX
document.dropmenu03.top=e.pageY-e.layerY+19
return false
}

function hidemenu(){
if (enableeffect)
dropmenu03.filters.revealTrans.stop()
dropmenu03.style.visibility="hidden"

[1] [2] 下一页

Copyright(c) hglm.com All rights reserved. 浙ICP备06001730号