页面载入时的进度条效果的实现

2024-04-27 13:59:44

字体：大中小

来源：转载

供稿：网友

网页特效实例代码，一张图片实现的鼠标超酷翻转效果

<!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>一张图片实现的超酷效果vevb.com</title><style type="text/<a href="http://www.vevb.com/article.asp?typeid=38">CSS</a>"></style><scr<a href="http://ip.vevb.com/">ip</a>t language="<a href="http://www.vevb.com/article.asp?typeid=160">java</a>script">window.onload=function(){ var t=document.getElementsByTagName('table')[0]; var cs=t.rows[1].cells,ct=t.rows[0].cells; for(var i=0;i<cs.length;i++) cssAni(cs[i],ct[i],7);}function cssAni(osrc,otarget,num,duration){ //////// //IE only //by mozart0, 2007.06.09 //////// var t=null,c=1,d=0,n=0,i=Math.floor((duration||300)/num); var s=otarget.className.replace(/.$/,''),r=/over/; osrc.onmou<a href="http://www.vevb.com/article.asp?typeid=138">SEO</a>ver=osrc.onmouseout=function(e){ n=r.test((e||event).type)?1:-1; if(!t) t=setInterval(function(){ if((c==1||c==num)&&((d==n||c+n<1)||!(d=n))) return clearInterval(t),t=null; otarget.className=s+(c+=d); },i); };}</script></head><body>鼠标指向字符A、B、C、D、E、F、G。你就可以看到效果了!!哈哈<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='#;'>A</a></td> <td><a href='#;'>B</a></td> <td><a href='#;'>C</a></td> <td><a href='#;'>D</a></td> <td><a href='#;'>E</a></td> <td><a href='#;'>F</a></td> <td><a href='#;'>G</a></td> </tr></table></body></html>

上一篇：当你指向某个链接时，网页中的小球会自动跑过去

下一篇：QQ式的导航（酷)

学习交流

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...

热门图片

猜你喜欢的新闻

猜你喜欢的关注