帮忙优化一下焦点图代码 还不完美
0
悬赏园豆：10
[已解决问题]
解决于 2013-07-08 13:18
$.fn.extend({ flash: function(){ var offset = this.offset(); var ul=$(this).children("ul"); var li=ul.children("li"); var w=$(this).width()/li.size(); for(var i=0;i<li.size();i++){ var span='<span> </span>'; $(this).append(span); var left=offset.left+(w*i); var bpostion=w*i; $(this).children("span").eq(i).css({width:($(this).width()/li.size())+'px',height:$(this).height(),position: 'absolute',top:offset.top+'px',left:left+'px',background:-bpostion+'px 0px no-repeat '}) } $('.bfocus').children("ul").children("li").children("img").eq(0).show(); var h=1; var index=0; var sw=parseInt($('.bfocus').width()/$('.bfocus').children("ul").children("li").size()); var t; setInterval(function (){ var s=$('.bfocus').children("ul").children("li").length; index=index >=s-1?0:index+=2; var b=$('.bfocus').children("ul").children("li").children("img").eq(index).attr("src"); $('.bfocus').children("span").css({backgroundImage:'url('+b+')'}); t=setInterval(function () { $('.bfocus').children("span").css({width:sw+'px'}); document.title=sw; if(sw<=0){ window.clearInterval(t); }else{ sw-=1; } },20); if(parseInt($('.bfocus').children("span").width())==0){ sw=parseInt($('.bfocus').width()/$('.bfocus').children("ul").children("li").size()) } },6000) } });
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"> </script><script src="http://upcdn.b0.upaiyun.com/libs/modernizr/modernizr-2.6.2.min.js" type="text/javascript"></script> <script src="Flash.js"></script> </head> <body><style> .tc_sytle1 { float: left; background: #fff; } *, html { margin: 0; padding: 0; } .section { margin: 0 auto; width: 1073px; } .bfocus { height: 216px; overflow: hidden; } img{width:100%; height:100%;} .bfocus ul { width:200%; } .bfocus ul li{width:1073px;height: 216px;} .bfocus ul li img{display:none;} </style> <br/> <section class="section bfocus"> <ul> <li ><img src="http://cqcmxy.com:81/Content/Image/01.png" alt="我院石美珊院长一行参观考察中铁华夏广告 有限公司" ></li> <li ><img src="http://cqcmxy.com:81/Content/Image/02.png" alt="我院举行“2013毕业生就业双选会”" ></li> <li><img src="http://cqcmxy.com:81/Content/Image/03.png" alt="我院第七届党课培训落下帷幕" ></li> </ul> </section> <script> $(".bfocus").flash(); </script> </body> </html>
最佳答案
0
还不错嘛。
不完美 没解决 性能问题 吃cpu
其他回答(3)
0
哪有完美的东西
0
呵呵，女程序员的完美主义情结啊
收获园豆：10
0
$(this) 像这样多次引用的dom 可以存到一个变量里边 比如 $this = $(this)
