javascriptphp前端jquery代码分析

<head><style type="text/css">.scroll_div{width:1000px; height:370px; margin:0 auto; padding:10px;}.scroll_div .pic{width:820px; height:370px; overflow:hidden; position:relative; float:left;}.scroll_div .pic li{width:820px; height:370px; position:absolute; top:0; left:0; display:none;}.scroll_div .btn{float:right; width:173px;}.scroll_div .btn li{width:173px; height:66px; display:block; float:left; text-align:center; color:#fff; font:18px/100% "微软雅黑"; font-weight:bold; background:#008dd8; margin-bottom:10px; line-height:66px; cursor:pointer;}.scroll_div .btn li.on{background:#d73737;}li {list-style:none;}img{width:100%;}</style></head><body><div class="scroll_div"><ul class="pic"><li><img  src="images/1.jpg" / alt="javascript-麻烦看下这段JQ代码，一点性能问题" ></li><li><img  src="images/2.jpg" / alt="javascript-麻烦看下这段JQ代码，一点性能问题" ></li><li><img  src="images/3.jpg" / alt="javascript-麻烦看下这段JQ代码，一点性能问题" ></li><li><img  src="images/4.jpg" / alt="javascript-麻烦看下这段JQ代码，一点性能问题" ></li><li><img  src="images/5.jpg" / alt="javascript-麻烦看下这段JQ代码，一点性能问题" ></li></ul><ul class="btn"><li>项目一</li><li>项目二</li><li>项目三</li><li>项目四</li><li>项目五</li></ul></div></body>    <script type="text/javascript">$(function(){var listLen = $(".pic li").length, //li的个数i=0,//下标初始值setInter,speen = 1500;//自动运行间隔/*图片轮播*/$(".btn li:last").css({"margin":"0px 0px 0px 0px"});//最后一个按钮样式$(".btn li:first").addClass("on");//为每个按钮增加的样式$(".pic li:first").show();//第一个图片展示$(".btn li").each(function(index,element){//点击显示不同图片$(element).click(function(){i = index;//选择器位置$(this).addClass("on").siblings().removeClass("on");//为当前按钮高亮$(".pic li").eq(index).animate({opacity:"show"},300).siblings().animate({opacity:"hide"},300);})//图片随着按钮的切换动作$(".pic li").hover(function(){//鼠标悬停停止自动播放（停止Interval)clearInterval(setInter);},function(){outPlay();});})out_fun = function(){if(i < listLen){i++;}else{i=0;};//判定位置，超过位置则重置到第一张位置。这里重置到第一张时会有延迟，目测比300多一点。$(".btn li").eq(i).addClass("on").siblings().removeClass("on");$(".pic li").eq(i).animate({opacity:"show"},300).siblings().animate({opacity:"hide"},300);}outPlay = function(){setInter = setInterval("out_fun()",speen);//周期循环调用}outPlay();//自动播放})</script>

这是一段自动播放和切换的jq代码，然后发现当播放到最后一张跳到第一张时会比平常的播放时间（这里是300）要稍长一点，不知道问题在哪，请问该如何解决或者优化？