首页 新闻 搜索 专区 学院

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

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>
SpeakHero的主页 SpeakHero | 初学一级 | 园豆:31
提问于:2013-06-15 19:47
< >
分享
最佳答案
0

还不错嘛。

yyutudou | 小虾三级 |园豆:997 | 2013-06-15 23:30

不完美 没解决 性能问题 吃cpu

SpeakHero | 园豆:31 (初学一级) | 2013-06-16 01:08
其他回答(3)
0

哪有完美的东西

积跬步 | 园豆:214 (菜鸟二级) | 2013-06-16 17:00
0

呵呵,女程序员的完美主义情结啊

收获园豆:10
二十三号同学 | 园豆:964 (小虾三级) | 2013-06-16 18:36
0

$(this) 像这样多次引用的dom 可以存到一个变量里边 比如 $this = $(this)

木头小木头 | 园豆:284 (菜鸟二级) | 2013-06-18 16:20
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册