js 实现banner轮播
2016-05-30 13:11
489 查看
<!--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);
}
}
相关文章推荐
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- 5个常见可用性错误和解决方案
- js数组实现图片轮播
- js可突破windows弹退效果代码
- JSP脚本漏洞面面观
- 使用BAT一句话命令实现快速合并JS、CSS
- js显示当前星期的起止日期的脚本
- 爆炸式的JS圆形浮动菜单特效代码
- js select常用操作控制代码
- JS实现不使用图片仿Windows右键菜单效果代码
- 从jsp发送动态图像
- 原生js结合html5制作小飞龙的简易跳球
- js 页面模块自由拖动实例
- js实现小鱼吐泡泡在页面游动特效
- js 提交和设置表单的值
- PHP VBS JS 函数 对照表
- node.js抓取并分析网页内容有无特殊内容的js文件
- PHP+JS实现大规模数据提交的方法
- 仿51JOB的地区选择效果(可选择多个地区)