帮忙优化一下焦点图代码 还不完美

$.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>
BIG阳
浏览 506回答 4
4回答

浮云间

还不错嘛。

神不在的星期二

哪有完美的东西

忽然笑

呵呵,女程序员的完美主义情结啊
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript