栏目导航
热门教程
相关教程
网页特效 下拉菜单-下拉式导航菜单 [收藏本页]
  • 作者：佚名 来源：本站整理 发布时间：2006-7-8 8:41:27

  • 脚本说明:
    第一步:把如下代码加入<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="time1.htm">本站首页</a></font><br>
    selection[1]= <font face="宋体"><a href="time2.htm">My求职信</a></font><br>
    selection[2]= <font face="宋体"><a href="time3.htm">网上赚钱</a></font><br>
    selection[3]= <font face="宋体"><a href="ye1.htm">免费资源</a></font><br>
    selection[4]= <font face="宋体"><a href="ye2.htm">免费资源</a></font><br>
    selection[5]= <font face="宋体"><a href="ye3.htm">免费资源</a></font><br>
    selection[6]= <font face="宋体"><a href="ye4.htm">免费资源</a></font><br>
    selection[7]= <font face="宋体"><a href="zh5.htm">免费资源</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"
    }

    function hidemenu2(){
    document.dropmenu03.visibility="hide"
    }

    if (document.layers){
    document.dropmenu01.document.dropmenu02.captureEvents(Event.CLICK)
    document.dropmenu01.document.dropmenu02.onclick=dropit
    }
    else if (document.all)
    document.body.onclick=hidemenu


    //-->


    </SCRIPT>
    <!-- 你可以改变菜单出现的绝对位置和外观风格-->
    <div id="dropmenu03" style="position:absolute;left:10;top:0;layer-background-color:seashell;background-color:seashell;width:100;visibility:hidden;border:1px solid black;padding:0px">
    <script language="JavaScript1.2">
    if (document.all)
    dropmenu03.style.padding= 6px
    for (i=0;i<selection.length;i++)
    document.write(selection[i])
    </script>
    </div>

    <script language="JavaScript1.2">
    if (document.layers){
    document.dropmenu03.captureEvents(Event.CLICK)
    document.dropmenu03.onclick=hidemenu2
    }
    </script>

     


  • [] [返回上一页] [打 印] [收 藏]
  • 上一篇教程：情链接导航框 下一篇教程：页面内部导航
Copyright © 2003-2008 站长助手 www.web162.com
辽ICP备05001760号 网络实名:站长助手 转载本站原创教程请注名来源于本站
力倡站长资源文化,崇尚互联共享,做中国最好站长网站,为中国网站提供动力！
始建于2003-3-1 8:10 中国首都·北京 辽宁(分站)
主资源渠道辽宁电信分公司服务器组及带宽！