资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
超个性的导航效果
超个性的导航效果,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <title>测试效果</title> <style type="text/css"> <!-- body {text-align:center} table {border:1px solid #eeeeee;padding:3px 0;border-bottom-width:5px} .icon td {width:50px;height:37px;background-image:url(/upload/20071104213204237.gif)} .capt td {font:normal 11px verdana;padding:2px 0} .a {background-position-y:0px} .b {background-position-y:-37px} .c {background-position-y:-74px} .d {background-position-y:-111px} .e {background-position-y:-148px} .f {background-position-y:-185px} .g {background-position-y:-222px} .f1 {background-position-x:0px} .f2 {background-position-x:-51px} .f3 {background-position-x:-101px} .f4 {background-position-x:-153px} .f5 {background-position-x:-205px} .f6 {background-position-x:-257px} .f7 {background-position-x:-309px} --> </style> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22javascript%22%3E%20%0D%0Awindow.onload%3Dfunction()%7B%20%0D%0A%20%20var%20t%3Ddocument.getElementsByTagName('table')%5B0%5D%3B%20%0D%0A%20%20var%20cs%3Dt.rows%5B1%5D.cells%2Cct%3Dt.rows%5B0%5D.cells%3B%20%0D%0A%20%20for(var%20i%3D0%3Bi%3Ccs.length%3Bi%2B%2B)%20%0D%0A%20%20%20%20cssAni(cs%5Bi%5D%2Cct%5Bi%5D%2C7)%3B%20%0D%0A%7D%20%0D%0Afunction%20cssAni(osrc%2Cotarget%2Cnum%2Cduration)%7B%20%0D%0A%20%20var%20t%3Dnull%2Cc%3D1%2Cd%3D0%2Cn%3D0%2Ci%3DMath.floor((duration%7C%7C300)%2Fnum)%3B%20%0D%0A%20%20var%20s%3Dotarget.className.replace(%2F.%24%2F%2C'')%2Cr%3D%2Fover%2F%3B%20%0D%0A%20%20osrc.onmouseover%3Dosrc.onmouseout%3Dfunction(e)%7B%20%0D%0A%20%20%20%20n%3Dr.test((e%7C%7Cevent).type)%3F1%3A-1%3B%20%0D%0A%20%20%20%20if(!t)%20t%3DsetInterval(function()%7B%20%0D%0A%20%20%20%20%20%20if((c%3D%3D1%7C%7Cc%3D%3Dnum)%26%26((d%3D%3Dn%7C%7Cc%2Bn%3C1)%7C%7C!(d%3Dn)))%20%0D%0A%20%20%20%20%20%20%20%20%20%20return%20clearInterval(t)%2Ct%3Dnull%3B%20%0D%0A%20%20%20%20%20%20otarget.className%3Ds%2B(c%2B%3Dd)%3B%20%0D%0A%20%20%20%20%7D%2Ci)%3B%20%0D%0A%20%20%7D%3B%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> </head> <body> <table> <tr class='icon'> <td class='a f1'></td> <td class='b f1'></td> <td class='c f1'></td> <td class='d f1'></td> <td class='e f1'></td> <td class='f f1'></td> <td class='g f1'></td> </tr> <tr class='capt'> <td><a href='#;' _ewebeditor_ta_href="%23%3B">A</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">B</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">C</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">D</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">E</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">F</a></td> <td><a href='#;' _ewebeditor_ta_href="%23%3B">G</a></td> </tr> </table> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程