资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
javascript 弹性菜单，垂直的那种
<html> <head> <style type="text/css"> body {cursor:hand; margin:0; padding:0; position:absolute; overflow:hidden; left:0; top:0; width:100%; height:100%;} .link {position:absolute;left:0;width:100%;height:0;background:#000;overflow:hidden;visibility:hidden;} .title {position:relative;cursor:pointer;background:#FF6600;width:100%;color:#fff;font-family:trebuchet MS;verdana;font-size:11px;left:2;height:15;overflow:hidden;} .title_o {position:relative;cursor:pointer;background:#fff;width:100%;color:#000;font-family:trebuchet MS;verdana;font-size:11px;left:2;height:15;overflow:hidden;} .text {position:relative;text-align:justify;margin:10px;font-family:trebuchet MS;verdana;font-size:11px;color:#FFF;overflow:hidden;height:90%} .fernando { font-family: "Trebuchet MS", Geneva, Arial, Helvetica, san-serif; font-size: 16px; font-weight: bolder} .mafra { } </style> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%3C!--%20%0D%0Avar%20object%20%3D%20new%20Array()%3B%20%0D%0Afunction%20Slide(N%2CoCont)%7B%20%0D%0Athis.N%20%3D%20N%3B%20%0D%0Athis.S%20%3D%201.1%3B%20%0D%0Athis.object%20%3D%20new%20Array()%3B%20%0D%0Athis.CObj%20%3D%20function%20(parent%2CN)%7B%20%0D%0Athis.parent%20%3D%20parent%3B%20%0D%0Athis.N%20%3D%20N%3B%20%0D%0Athis.obj%20%3D%20parent.frm%5BN%5D%3B%20%0D%0Athis.tit%20%3D%20this.obj.firstChild%3B%20%0D%0Athis.div%20%3D%20this.obj.getElementsByTagName(%22div%22)%5B1%5D%3B%20%0D%0Athis.div.style.visibility%20%3D%20%22hidden%22%3B%20%0D%0Athis.y0%20%3D%20N%20*%2018%3B%20%0D%0Athis.Y1%20%3D%20this.y0%3B%20%0D%0Athis.obj.style.top%20%3D%20this.y0%3B%20%0D%0Athis.obj.style.height%20%3D%20parent.H%20-%20(parent.NF-1)%20*%2018%20-%203%3B%20%0D%0Athis.obj.style.visibility%20%3D%20%22visible%22%3B%20%0D%0Athis.obj.parent%20%3D%20this%3B%20%0D%0Athis.run%20%3D%20false%3B%20%0D%0Athis.move%20%3D%20function()%7B%20%0D%0Awith(this)%7B%20%0D%0Ady%20%3D%20(y1-y0)%2Fparent.S%3B%20%0D%0Aif(Math.abs(dy)%3E.1)%7B%20%0D%0Ay0%2B%3Ddy%3B%20%0D%0Aobj.style.top%20%3D%20Math.round(y0)%3B%20%0D%0AsetTimeout(%22object%5B%22%2Bparent.N%2B%22%5D.object%5B%22%2BN%2B%22%5D.move()%3B%22%2C%2016)%3B%20%0D%0A%7D%20else%20%7B%20%0D%0Arun%20%3D%20false%3B%20%0D%0Aif(dy%3E0)div.style.visibility%3D%22hidden%22%3B%20%0D%0Aelse%20if(N%3E0)parent.object%5BN-1%5D.div.style.visibility%3D%22hidden%22%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Athis.obj.onmouseover%20%3D%20function()%7B%20%0D%0Awith(this.parent)%7B%20%0D%0Aif(!run)%7B%20%0D%0Arun%20%3D%20true%3B%20%0D%0Adiv.style.visibility%3D%22visible%22%3B%20%0D%0Afor(i%3D0%3Bi%3Cparent.NF%3Bi%2B%2B)parent.object%5Bi%5D.tit.className%20%3D%20%22title%22%3B%20%0D%0Atit.className%20%3D%20%22title_o%22%3B%20%0D%0Afor(i%3D0%3Bi%3C%3DN%3Bi%2B%2B)%7B%20%0D%0Aparent.object%5Bi%5D.y1%20%3D%20i*18%3B%20%0D%0Aparent.object%5Bi%5D.move()%3B%20%0D%0A%7D%20%0D%0Afor(i%3DN%2B1%3Bi%3Cparent.NF%3Bi%2B%2B)%7B%20%0D%0Aparent.object%5Bi%5D.y1%20%3D%20parent.H-(parent.NF-i)*18%3B%20%0D%0Aparent.object%5Bi%5D.move()%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Athis.frm%20%3D%20document.getElementById(oCont)%3B%20%0D%0Athis.H%20%3D%20parseInt(this.frm.style.height)%3B%20%0D%0Athis.frm%20%3D%20this.frm.getElementsByTagName(%22span%22)%3B%20%0D%0Athis.NF%20%3D%20this.frm.length%3B%20%0D%0Afor(i%3D0%3Bi%3Cthis.NF%3Bi%2B%2B)%20this.object%5Bi%5D%20%3D%20new%20this.CObj(this%2C%20i)%3B%20%0D%0Athis.object%5B0%5D.obj.onmouseover()%3B%20%0D%0Athis.S%20%3D%2010%3B%20%0D%0A%7D%20%0D%0Aonload%20%3D%20function()%20%7B%20%0D%0Aobject%5B0%5D%20%3D%20new%20Slide(0%2C%20%22frames%22)%3B%20%0D%0A%7D%20%0D%0A%2F%2F--%3E%20%0D%0A%3C%2Fscript%3E"> </head> <body bgcolor="#333333"> <div style="position:absolute;left:50%;top:50%"> <div id="frames" style="position:absolute;width:200;height:340;left:-100;top:-180;overflow:hidden"> <span class="link"> <div class="title"></div> <div style="position:relative;text-align:center;margin:0px;font-family:trebuchet MS; verdana;font-size:29px;font-weight:bold;color:#FFF;overflow:hidden;height:120%"> <a href="http://www.mafra.fot.br/photos/alimentos.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Falimentos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_logo_home.gif" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_logo_home.gif" width="191" height="189" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> alimentos /<i> food</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/alimentos.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Falimentos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-01.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-01.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> bebidas /<i> drinks</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/bebidas.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fbebidas.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-02.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-02.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> joias /<i> jewels</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/joias.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fjoias.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-03.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-03.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> natureza /<i> nature</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/natureza.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fnatureza.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-04.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-04.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> gente /<i> people</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/pessoas.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fpessoas.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-05.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-05.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> produtos /<i> products</i></b></div> <div class="text"> <a href="http://www.mafra.fot.br/photos/produtos.htm" _ewebeditor_ta_href="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fprodutos.htm" target="_self" onFocus="if(this.blur)this.blur()"><img src="http://www.mafra.fot.br/photos/images/img_home-06.jpg" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_home-06.jpg" width="183" height="174" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> contato /<i> contact</i></b></div> <div style="position:relative;text-align:center;margin:0px;font-family:verdana;font-size:32px;font-weight:bold;color:#FFF;overflow:hidden;height:90%"> <a href="mailto:mafra@mafra.fot.br?Subject=Contato - Contact" _ewebeditor_ta_href="mailto%3Amafra%40mafra.fot.br%3FSubject%3DContato%20-%20Contact"><img src="http://www.mafra.fot.br/photos/images/img_assina_home.gif" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_assina_home.gif" width="191" height="189" border="0"></a> </div> </span> <span class="link"> <div class="title"><b> contato /<i> contact</i></b></div> <div style="position:relative;text-align:center;margin:0px;font-family:verdana;font-size:32px;font-weight:bold;color:#FFF;overflow:hidden;height:90%"> <a href="mailto:mafra@mafra.fot.br?Subject=Contato - Contact" _ewebeditor_ta_href="mailto%3Amafra%40mafra.fot.br%3FSubject%3DContato%20-%20Contact"><img src="http://www.mafra.fot.br/photos/images/img_assina_home.gif" _ewebeditor_ta_src="http%3A%2F%2Fwww.mafra.fot.br%2Fphotos%2Fimages%2Fimg_assina_home.gif" width="191" height="189" border="0"></a> </div> </span> </div> </div> <div style="position:relative; text-align:center; margin:0px; font-family:verdana; font-size:9px; font-weight:normal; color:#999999; overflow:hidden; height:131px; left: 414px; top: 474px; width: 172px;"> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A_uacct%20%3D%20%22UA-1182901-1%22%3B%20%0D%0AurchinTracker()%3B%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程