求一种导航菜单特效

可以去下这样的flash导航条，

解决方案 »

  1.   

    <script language="Javascript">
    <!--
    var m=5; //声明一个存放子菜单图层数的变量，当子菜单图层数不是5时，要改变这个变量的值
    var can=new Array(); //声明一个数组，存放是否拉出子菜单的控制代码
    var newdivleft=new Array() //声明一个数组，存放各图层新的“left”参数值
    var olddivleft=new Array() //声明一个数组，存放初始的各图层“left”参数值
    var margeleft=parseInt(document.all.div0.style.left); //声明存放拉出子菜单的左边距变量
    for (i=0;i<=m;i++){ //获取上面声明的数组的初始值
    objname=eval("document.all.div"+(i)+".style");
    newdivleft[i]=parseInt(objname.left);
    olddivleft[i]=newdivleft[i];
    can[i]=0;}
    function canout(x){ //设置子菜单是拉出还是推入的控制代码，为1时拉出，为0时推入。
    if (can[x]==1) can[x]=0;else can[x]=1;
    }
    function moveout(x){
    k=x;
    if (can[x]==1) { //开始拉出子菜单
    newdivleft[x]+=6; //设置每次拉出6个像素
    if (newdivleft[x]<(margeleft+6)) { //如果没有拉到位，可继续拉。
    thisdiv=eval("document.all.div"+(x)+".style"); 
    thisdiv.left=newdivleft[x]; //拉一次子菜单
    t1=setTimeout("moveout(k)",10); //每10毫秒拉动一次子菜单
    }
    else
    {thisdiv.left=olddivleft[0]; 
    clearTimeout(t1);} //如果子菜单已拉到位，则清除定时函数，停止拉动子菜单。
    }
    else
    {
    if (can[x]==0){ //开始推入子菜单，方法与拉出子菜单时相同，只是方向相反。
    newdivleft[x]-=6;
    if (newdivleft[x]>(olddivleft[x]-5)) {
    thisdiv=eval("document.all.div"+(x)+".style");
    thisdiv.left=newdivleft[x];
    t2=setTimeout("moveout(k)",10)} else
    {clearTimeout(t2);}
    }
    }}
    -->
    </script>
      

  2.   

    <head>
    <style>
    body,td,a {font-size:9pt;color:#000000;text-decoration:none}
    .normal {padding:2px}
    .up {padding:1px;border:#999999 1px solid;background:#CCCCCC}
    .down {padding:1px;border:dbdbdb 1px solid;background:dbdbdb}
    .menuv {filter: revealTrans(transition=23,duration=0.5);padding:2px}
    </style>
    </head><body onmousemove="move()" onload=bodyload()>
    <script>
    //闪烁的表格边框
    function flashit(){if(!document.all)return;if (td123.style.borderColor=="black")td123.style.borderColor="#999999";else td123.style.borderColor="black"}setInterval("flashit()",500)
    //渐入的效果,改变alpha值
    function high(image){theobject=image,highlighting=setInterval("highlightit(theobject)",100)}function low(image){clearInterval(highlighting),image.filters.alpha.opacity=50}function highlightit(cur2){if (cur2.filters.alpha.opacity<100)cur2.filters.alpha.opacity+=20;else if(window.highlighting)clearInterval (highlighting)}
    //拖动层的js
    var over=false,down=false,divleft,divtop;function move(){if(down){plane.style.left=event.clientX-divleft;plane.style.top=event.clientY-divtop;}}
    //滑动层
    function bodyload()
    {
    if(plane.style.pixelTop!=0)
    {
    plane.style.pixelTop-=10
    setTimeout('bodyload()',1)
    }
    }
    //渐变显示层
    function Show(divid) {
    divid.filters.revealTrans.apply();
    divid.style.visibility = "visible";
    divid.filters.revealTrans.play();
    }
    function Hide(divid) {
    divid.filters.revealTrans.apply();
    divid.style.visibility = "hidden";
    divid.filters.revealTrans.play();
    }</script>
    <div style="position:absolute;z-index:1;width:1;height:1; left: 0; top: 500" ID=plane onmousedown="down=true;divleft=event.clientX-parseInt(plane.style.left);divtop=event.clientY-parseInt(plane.style.top)" onmouseup="down=false">
    <table id="td123" cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="F4F4F4">
    <tr>
    <td bgcolor="#CCCCCC" height="20" style="BORDER:#999999 1px solid;cursor:move">
    <div align="center"><font color="#000000">多级滑动菜单</font></div>
    </td>
    </tr>
    <tr><td class=normal onMouseDown="this.className='down'" onMouseOver="this.className='up',high(this),Show(menu1)" onMouseOut="this.className='normal',low(this),menu1.style.visibility='hidden'" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'"><div align="center">奥天软件</div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" onMouseOver="this.className='up',high(this),Show(menu2)" onMouseOut="this.className='normal',low(this),menu2.style.visibility='hidden'" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'"><div align="center">奥都影城</div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" onMouseOver="this.className='up',high(this),Show(menu3)" onMouseOut="this.className='normal',low(this),menu3.style.visibility='hidden'" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'"><div align="center">喜欢的网站</div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'"><div align="center"><a href="mailto:[email protected]" target="_top">咨询信箱</a></div></td></tr>
    </table>接下
      

  3.   

    <div id="menu1" style="position:absolute;top:24px;left:96px; z-index:1; visibility: hidden; width: 105" onMouseOver=this.style.visibility='visible' onMouseOut=this.style.visibility='hidden' class="menuv">
    <table cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="F4F4F4" align="right">
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aosky.net/jspghost/jspghost.htm" target="_blank"></a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aosky.net/supercash/supercash.htm" target="_blank">超级赚钱器</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aosky.net/mailreg/mailreg.htm" target="_blank">邮箱注册器</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="mailto:[email protected]" target="_top">咨询信箱</a></div></td></tr>
    </table></div>
    <div id="menu2" style="position:absolute;top:44px;left:96px; z-index:1; visibility: hidden; width: 105" onMouseOver=this.style.visibility='visible' onMouseOut=this.style.visibility='hidden' class="menuv">
    <table cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="F4F4F4" align="right">
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/xj/xj01.htm" target="_blank">喜剧片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/dz/dz01.htm" target="_blank">动作片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/kh/kh01.htm" target="_blank">科幻片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/aq/aq01.htm" target="_blank">爱情片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/kb/kb01.htm" target="_blank">恐怖片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/zn/zn01.htm" target="_blank">灾难片</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/zz/zz01.htm" target="_blank">战争片</a></div></td></tr>
    </table></div>
    <div id="menu3" style="position:absolute;top:64px;left:96px; z-index:1; visibility: hidden; width: 105" onMouseOver=this.style.visibility='visible' onMouseOut=this.style.visibility='hidden' class="menuv">
    <table cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="F4F4F4" align="right">
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.sina.com.cn" target="_blank">新浪网</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.netease.com" target="_blank">网易</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.sohu.com" target="_blank">搜狐</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.newhua.com.cn" target="_blank">华军软件园</a></div></td></tr>
    <tr><td class=normal onMouseDown="this.className='down'" 
    onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)" onMouseUp="this.className='up'">
    <div align="center"><a href="http://www.aodufilm.net/bbs" target="_blank">奥都论坛</a></div></td></tr>
    </table></div></div>
    <body>看看吧这个非常好
    不行再说我还有