回优化焦点图代码-JavaSript-爱易网页

回优化焦点图代码

日期：2014-05-16　浏览次数：20367 次

来优化焦点图代码

$.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+=1;

							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;

						}

				  },50);

				  if(parseInt($('.bfocus').children("span").width())==0){

					  sw=parseInt($('.bfocus').width()/$('.bfocus').children("ul").children("li").size())

					  }

				  },10000)

    }	

});

一个焦点图代码关于定时器哪里还不完美求高手解决

------解决方案--------------------

<!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="鎴戦櫌鐭崇編鐝婇櫌闀夸竴琛屽弬瑙傝€冨療涓搧鍗庡骞垮憡

 <

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

回优化焦点图代码

相关资料更多>

推荐阅读更多>