当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Menu

Javascript
给初学者提供几本学习js值得看的书
Javascript----文件操作
Vml+Js算法:完成5个小球在网页运动(碰壁返回)的游戏,详细注释
Vml+Dhtml:制作一个应用渐变颜色效果不错的进度条
Dhtml+Js算法:5个小球运动的简化版,变通实现更简单的飞行的图片
Vml+Dhtml:小小的页面效果,叫它"淘气鬼"好了
判断客户浏览器是否支持cookie
几种常用的表单输入判断
CSDN无限级树数据库版(ASP+ACCESS)
JavaScript 寫遊戲 : 俄羅斯方塊
JavaScript 寫遊戲 : 搬吖
JavaScript 遊戲 : 貪吃蛇
JavaScript 寫時鍾日曆
VML:经典的图片叠加效果(灰色调)
一个简单的仿xp的js下拉菜单
JScript 寫 sortNode
关于javascript中数组元素删除问题的讨论
IE中非模式对话框(showModelessDialog)应用
Dhtml:用ondrag事件简单的实现鼠标拖动物件.
对WebUI技术感兴趣的说

Javascript 中的 Menu


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 58 ::
收藏到网摘: n/a

<style>



body,td,a  {font-size:9pt;color:black;text-decoration:none}



.normal  {padding:2px}



.up  {padding:1px;border:#999999  1px  solid;background:#cccccc}



.down  {padding:1px;border:dbdbdb  1px  solid;background:dbdbdb}



</style>



<body  onmousemove="move()">



<div  style="position:absolute;z-index:1;width:1;height:1;  left:  100;  top:  100"  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">透明的菜单</div>



</td>



</tr>



<tr>



<td  class=normal  onMouseDown="this.className='down'"



onMouseOver="this.className='up',high(this),menu1.style.visibility='visible'"  onMouseOut="this.className='normal',low(this),menu1.style.visibility='hidden'"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'"  >



<div  align="right">有下级菜单>></div>



</td>



</tr>



<tr>



<td  class=normal  onMouseDown="this.className='down'"



onMouseOver="this.className='up',high(this),menu2.style.visibility='visible'"  onMouseOut="this.className='normal',low(this),menu2.style.visibility='hidden'"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'"  >



<div  align="right">有下级菜单>></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="right">无下级菜单>></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="right">无下级菜单>></div>



</td>



</tr>



</table>



<script  language="JavaScript">



<!--



function  flashit(){



if  (!document.all)



return



if  (td123.style.borderColor=="#666666")



td123.style.borderColor="#999999"



else



td123.style.borderColor="#666666"



}



setInterval("flashit()",  500)



//-->



</script>



<script  language="javascript">



<!--



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)



}



//-->



</script>



<script>



var  over=false,down=false,divleft,divtop;



function  move(){



if(down){



plane.style.left=event.clientX-divleft;



plane.style.top=event.clientY-divtop;



}



}



</script>



    <div  id="menu2"  style="position:absolute;top:45px;left:96;  z-index:1;  visibility:  hidden;  width:  105"



onMouseOver=this.style.visibility='visible'



onMouseOut=this.style.visibility='hidden'>  



        <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">子菜单</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>子菜单</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>子菜单</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>子菜单</div>



                </td>



            </tr>



        </table>



    </div>



    <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'>  



        <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">子菜单</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>子菜单</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>子菜单</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>子菜单</div>



</td>



</tr>



</table>



</div>



</div>