62、左上角导航菜单

62、左上角导航菜单

脚本说明:

第一步:把如下代码加入<body>区域中

<style>#D1 {

       BACKGROUND-COLOR: lightgreen;

       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:#3399ff;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>

<div id="D1">

 

<table border="0" width="294">

<TBODY>

  <tr>

    <td align="middle" bgColor="#008000" rowSpan="2" width="14"><font color="#FFFFFF">

    M<br>

    E<br>

    N<br>

    U</font></td>

    <td width="127"> <ul>

      <li><a href="http://www.7stk.com/">

          网页特效代码</a> 

      </li>

      <li><a href="http://www.7stk.com/fine/index.htm">

          精彩网页分享</a> 

      </li>

      <li><a href="http://www.7stk.com/radio/radio.htm">

         音乐电台代码</a> 

      </li>

      <li><a href="javascript:void(0)">

               4</a> 

      </li>

      <li><a href="javascript:void(0)">

               5</a> 

      </li>

    </ul>

    </td>

    <td width="133">

    </td>

  </tr>

 </TBODY>

</table>

</div>

 

第二步:把<body>中的内容改为:

<body onload="init()" >

 

Write a comment

Comments: 0