|
该帖已经被评为良好帖
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-07-07
讨论这个有点偏题了，抱歉，呵呵
另外，下面这个是我之前写的，也内存泄漏问题，希望得到指点修正一下： 引用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>zCool</title> <style type="text/css" > #g li{ list-style:none; float:left; margin:20px; border:1px solid #ccc; width:50px; height:37px; background:url(http://www.google.cn/intl/zh-CN/images/toolbar_animation_20080512.png) no-repeat; cursor:pointer; } img{ border:1px dashed #ccc; } </style> </head> <body> <ul id="g"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> <img src="http://www.google.cn/intl/zh-CN/images/toolbar_animation_20080512.png" /> <script type="text/javascript"> var _setInterval=window.setInterval; window.setInterval=function(fn, delay){ if(typeof fn=="function"){ var args=Array.prototype.slice.call(arguments, 2); var f=function(){fn.apply(null, args)}; return _setInterval(f, delay); } return _setInterval(fn, delay); } var li=document.getElementById("g").getElementsByTagName("li"), intervalId, j=0; for(var i=0, l=li.length; i<l; i++){ var lii=li[i], bp="0px "+(i*-37)+"px"; lii.style.backgroundPosition=bp; lii.onmouseover=function(){ intervalId=setInterval(flash, 50, this.style); }; lii.onmouseout=(function(bp){ return function(){ intervalId=clearInterval(intervalId); j=0; this.style.backgroundPosition=bp; } })(bp); } function flash(ts){ if(j<5){ if(j<4){ ts.backgroundPosition=ts.backgroundPosition.replace(/^(-?\d+)(?=px\s-?\d+px)/, function(){return parseInt(arguments[1])-52;}); }else{ ts.backgroundPosition=ts.backgroundPosition.replace(/(-?\d+)(?=px$)/, function(){return parseInt(arguments[1])+4;}); } j++; intervalId=clearInterval(intervalId); intervalId=setInterval(flash, 50, ts); }else{ intervalId=clearInterval(intervalId); j=0; } }; </script> </body> </html> |
| 返回顶楼 | |
|
发表时间：2008-07-08
修改了下：
引用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>zCool</title> <style type="text/css" > #g{ display:inline;} #g li{ list-style:none; float:left; margin:10px; width:50px; height:37px; background:url(http://www.google.cn/intl/zh-CN/images/toolbar_animation_20080512.png) no-repeat; cursor:pointer; } #g a{ position:absolute; padding:48px 0 0; width:50px; font:12px/22px "宋体"; text-align:center; white-space:nowrap; text-decoration:none; } #g a:hover{ color:#f00; text-decoration:underline; } em.new{ color:#f00; font:10px "宋体"; vertical-align:top; } img{ border:1px dashed #ccc;} </style> </head> <body> <ul id="g"> <li><a href="javascript:;" title="搜索热门网络视频">视频</a></li> <li><a href="javascript:;" title="搜索全球的图片">图片</a></li> <li><a href="javascript:;" title="搜索您身边的分类生活信息">生活<em class="new">新!</em></a></li> <li><a href="javascript:;" title="查询地址、搜索周边和规划线路">地图</a></li> <li><a href="javascript:;" title="商业信息、财经新闻、实时股价和动态图表">财经</a></li> <li><a href="javascript:;" title="查看分类热门搜索排行">热榜</a></li> <li><a href="javascript:;" title="网址大全、快速直达分常用网站">网站导航</a></li> </ul> <img src="http://www.google.cn/intl/zh-CN/images/toolbar_animation_20080512.png" /> <script type="text/javascript"> // IE缓存图像 try{ document.execCommand("BackgroundImageCache", false, true); } catch(e){ } var li=document.getElementById("g").getElementsByTagName("li"), intervalId, j=0; for(var i=0, l=li.length; i<l; i++){ var lii=li[i], bp="0px "+(i*-37)+"px"; lii.style.backgroundPosition=bp; lii.onmouseover=function(){ intervalId=setInterval((function(o){return function(){flash.call(o)}})(this), 50); }; lii.onmouseout=(function(bp){ return function(){ intervalId=clearInterval(intervalId); j=0; this.style.backgroundPosition=bp; } })(bp); } function flash(){ var ts=this.style; if(j<5){ if(j<4){ ts.backgroundPosition=ts.backgroundPosition.replace(/^(-?\d+)(?=px\s-?\d+px)/, function(){return parseInt(arguments[1])-52;}); }else{ ts.backgroundPosition=ts.backgroundPosition.replace(/(-?\d+)(?=px$)/, function(){return parseInt(arguments[1])+4;}); } j++; }else{ intervalId=clearInterval(intervalId); j=0; } }; </script> </body> </html> |
| 返回顶楼 | |
|
发表时间：2008-12-12
最要命的是在a标签下了div
貌似在 a 标签下不能 嵌套 div 能不能说一下原因啊 |
| 返回顶楼 | |
|
发表时间：2009-02-08
你这个不支持点击上面浮动出来的文字啊。
google的可以。 |
| 返回顶楼 | |
