资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
效果直逼flash的Div+Css+Js菜单
效果直逼flash的Div+Css+Js菜单
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜单</title> <style> body{ background-color:#B8B8A0; } #fbtn{ display:none; overflow:hidden; border-style:solid; border-width:1px; border-color:#e1e1c9 #e1e1c9 #6e6e56 #6e6e56; padding:1 1 1 1; width:115px; height:30px; } #fbtn_txt{ position:relative; } #fbtn_txt div{ height:30px; padding-top:11px; font-size:12px; color:#800080; text-align:center; cursor:hand; } #fbtn_mask{ background-color:#ffffff; position:relative; width:100%; height:100%; } </style> </head> <body> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>G1</div> <div>good morning</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>G2</div> <div>good evening</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>M1</div> <div>my name is fireyy</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>M2</div> <div>mm mm i love u</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>G1</div> <div>good morning</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>G2</div> <div>good evening</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>M1</div> <div>my name is fireyy</div> </div> </div> <div id=fbtn> <div id=fbtn_mask></div> <div id=fbtn_txt> <div>M2</div> <div>mm mm i love u</div> </div> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%20%0D%0Avar%20current%3Dnull%3B%20%20%0D%0Avar%20t%3Dnull%3B%20%20%0D%0A%0D%0Afor(var%20i%3D0%3Bi%3Cfbtn.length%3Bi%2B%2B)%7B%20%20%0D%0Afbtn_txt%5Bi%5D.style.posTop%3D-30%3B%20%20%0D%0Afbtn_mask%5Bi%5D.style.posTop%3D-30%3B%20%20%0D%0Afbtn%5Bi%5D.index%3Di%3B%20%20%0D%0Afbtn%5Bi%5D.style.display%3D%22block%22%3B%20%20%0D%0A%0D%0Afbtn%5Bi%5D.onmouseover%3Dfunction()%7B%20%20%0D%0Aif(!current)%7B%20%20%0D%0Acurrent%3Dthis%3B%20%20%0D%0Adomove(this.index)%3B%20%20%0D%0A%7D%20%20%0D%0Aelse%20%20%20%0D%0Aif(current!%3Dthis)%7B%20%20%0D%0Adomove(current.index)%3B%20%20%0D%0Adomove(this.index)%3B%20%20%0D%0Acurrent%3Dthis%3B%20%20%0D%0A%7D%20%20%0D%0A%7D%20%20%0D%0A%0D%0Afbtn%5Bi%5D.onmouseout%3Dfunction()%7B%20%20%0D%0Aif(event.toElement%3D%3Dthis.parentElement%26t%3D%3Dthis)%7B%20%20%0D%0Adomove(this.index)%3B%20%20%0D%0Acurrent%3Dnull%3B%20%20%0D%0A%7D%20%20%0D%0A%7D%20%20%0D%0A%7D%20%20%0D%0A%0D%0Afunction%20domove(num)%7B%20%20%0D%0Avar%20o%3Dfbtn_txt%5Bnum%5D%3B%20%20%0D%0Avar%20m%3Dfbtn_mask%5Bnum%5D%3B%20%20%0D%0Aif(o.style.posTop%3C-60)%7B%20%20%0D%0Ao.style.display%3D%22none%22%3B%20%20%0D%0Avar%20t%3Do.children%5B1%5D.innerHTML%3B%20%20%0D%0Ao.children%5B1%5D.innerHTML%3Do.children%5B0%5D.innerHTML%3B%20%20%0D%0Ao.children%5B0%5D.innerHTML%3Dt%3B%20%20%0D%0Ao.style.posTop%3D-30%3B%20%20%0D%0Ao.style.display%3D%22block%22%3B%20%20%0D%0Aif(m.style.posTop%3E30)%20%20%0D%0Am.style.posTop%3D-30%3B%20%20%0D%0Aelse%20%20%0D%0Am.style.posTop%3D0%3B%20%20%0D%0A%7D%20%20%0D%0Aelse%7B%20%20%0D%0Am.style.posTop%2B%3D3%3B%20%20%0D%0Ao.style.posTop-%3D3%3B%20%20%0D%0AsetTimeout('domove('%2Bnum%2B')'%2C15)%3B%20%20%0D%0A%7D%20%20%0D%0A%7D%20%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程