js 实现banner轮播

来源：互联网发布：斑马zebra笔怎么样知乎编辑：程序博客网时间：2024/06/11 13:27

<!--Banner Start--><div id="Banner">  <ul id="fcimg">  <{section name=ad_k loop=$adData }>    <a <{if $adData[ad_k].url  }> href="<{$adData[ad_k].url}>" target="_blank"<{/if}> >    <!-- <li class="list-item" style="background: url(<{$smarty.const.UPYUN_WWW_PATH}><{$adData[ad_k].image}>) no-repeat center top;"></li> -->    <li class="" style="background: url(<{$smarty.const.UPYUN_WWW_PATH}><{$adData[ad_k].image}>) no-repeat center top;"></li>    </a>    <{/section}>  </ul>  <script type="text/javascript" src="js/duice.js"></script> </div>

js：

var indx = 1;var looper = 6000;var myTimer;$(document).ready(function(){if($('#thscrll') && $('#thscrll img').length > 0) { $('#thscrll').css({"padding-bottom":"15px"}); }  if($("#fcimg li").length >1){  $("#fcimg").after( $('<div></div><ul id="fcnum"></ul>'));     for(i=1;i<=$("#fcimg li").length;i++){if(i==1) $("#fcnum").append($("<li class=\"crn\"> </li>")); else $("#fcnum").append($("<li> </li>")); }    myTimer = setInterval('showFImg("#fcimg li","#fcnum li","crn")', looper);$("#fcnum li").click(function(){indx  =  $("#fcnum li").index(this);showFImg("#fcimg li","#fcnum li","crn");try{clearInterval(myTimer);myTimer = setInterval('showFImg("#fcimg li","#fcnum li","crn")', looper);}catch(e){}return false;}); $("#fcimg").hover(function(){if(myTimer){ clearInterval(myTimer); }},function(){myTimer = setInterval('showFImg("#fcimg li","#fcnum li","crn")', looper);});  }});function showFImg(il,nl,cs){  if($(il).length >1){crobj = $(il).eq(indx);$(il).not(crobj).hide();$(nl).removeClass(cs)$(nl).eq(indx).addClass(cs);crobj.stop(true,true).fadeIn('slow');indx = (++indx) % ($(il).length);  }}

0 0