轮播图片正常链接都是最后一个,不跟随图片循环

海天一色2 2017-07-08 10:39:23
<script type="text/javascript">

;(function($){

$.fn.lubo=function(options){

var defaults={

}

var options=$.extend(defaults,options);

return this.each(function(){

var _lubo=jQuery('.lubo');

var _box=jQuery('.lubo_box');

var _this=jQuery(this);

var luboHei=_box.height();

var Over='mouseover';

var Out='mouseout';

var Click='click';

var Li="li";

var _cirBox='.cir_box';

var cirOn='cir_on';

var _cirOn='.cir_on';

var cirlen=_box.children(Li).length;



var luboTime=2000;



var switchTime=400;

cir();



Btn();





function cir(){



_lubo.append('<ul class="cir_box"></ul>');



var cir_box=jQuery('.cir_box');



for(var i=0; i<cirlen;i++){



cir_box.append('<li style="" value="'+i+'"></li>');

}



var cir_dss=cir_box.width();



cir_box.css({



left:'50%',



marginLeft:-cir_dss/2,



bottom:'0'



});



cir_box.children(Li).eq(0).addClass(cirOn);



function Btn(){



_lubo.append('<div class="lubo_btn"></div>');



var _btn=jQuery('.lubo_btn');



_btn.append('<div class="left_btn"><</div><div class="right_btn">></div>');



var leftBtn=jQuery('.left_btn');



var rightBtn=jQuery('.right_btn');



leftBtn.bind(Click,function(){



var cir_box=jQuery(_cirBox);



var onLen=jQuery(_cirOn).val();



_box.children(Li).eq(onLen).stop(false,false).animate({



opacity:0



},switchTime);



if(onLen==0){



onLen=cirlen;



}



_box.children(Li).eq(onLen-1).stop(false,false).animate({



opacity:1



},switchTime);

cir_box.children(Li).eq(onLen-1).addClass(cirOn).siblings().removeClass(cirOn);



})



rightBtn.bind(Click,function(){



var cir_box=jQuery(_cirBox);



var onLen=jQuery(_cirOn).val();



_box.children(Li).eq(onLen).stop(false,false).animate({



opacity:0



},switchTime);



if(onLen==cirlen-1){



onLen=-1;



}



_box.children(Li).eq(onLen+1).stop(false,false).animate({



opacity:1



},switchTime);

cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);



})

}



int=setInterval(clock,luboTime);



function clock(){



var cir_box=jQuery(_cirBox);



var onLen=jQuery(_cirOn).val();



_box.children(Li).eq(onLen).stop(false,false).animate({



opacity:0



},switchTime);



if(onLen==cirlen-1){



onLen=-1;



}



_box.children(Li).eq(onLen+1).stop(false,false).animate({



opacity:1



},switchTime);

cir_box.children(Li).eq(onLen+1).addClass(cirOn).siblings().removeClass(cirOn);

}

_lubo.bind(Over,function(){



clearTimeout(int);



});



_lubo.bind(Out,function(){



int=setInterval(clock,luboTime);



});



jQuery(_cirBox).children(Li).bind(Over,function(){



var inde = jQuery(this).index();



jQuery(this).addClass(cirOn).siblings().removeClass(cirOn);



_box.children(Li).stop(false,false).animate({



opacity:0



},switchTime);



_box.children(Li).eq(inde).stop(false,false).animate({



opacity:1



},switchTime);



});





});



}

})(jQuery);





<script type="text/javascript">



$(function(){



$(".lubo").lubo({



});



})



</script>

<div class="lubo">

<ul class="lubo_box">

<li style=" opacity: 1;filter:alpha(opacity=100);"><a href=""><img src="1.jpeg"></a></li>

<li><a href=""><img src="2.jpeg"></a></li>

<li><a href=""><img src="3.jpeg"></a></li>

<li><a href=""><img src="4.jpeg"></a></li>

<li><a href=""><img src="5.jpeg"></a></li>

<li><a href=""><img src="2.jpeg"></a></li>

<li><a href="4.html"><img src="3.jpeg"></a></li>

<li><a href="5.html"><img src="4.jpeg"></a></li>

<li><a href="6.html"><img src="5.jpeg"></a></li>

</ul>

</div>
...全文
202 回复 打赏 收藏 转发到动态 举报
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复
常用 网页广告 代码全集 js 广告代码 大全 120种 1:对联广告代码演示下载 2:对联广告带关闭代码演示下载 3:大幅广告自动翻滚代码演示下载 4:大幅广告代码演示下载 5:横向滚动代码演示下载 6:幻灯代码演示下载 7:大幅自动轮换代码演示下载 8:对联广告带上面关闭代码下载 9:右上角翻页关闭代码演示下载 10:两个焦点代码演示下载 11:页面随意漂浮代码演示下载 12:自由变化显示方式代码演示下载 13:右上拉链式打开代码演示下载 14:全屏缩放广告代码演示下载 15:右下角提示消息广告代码下载 16:右下角弹出关闭变背投演示下载 17:右侧提示点击成全屏演示下载 18:宽频焦点代码演示下载 19:横向移动视觉广告代码演示下载 20:向左移动的广告代码演示下载 21:竖行友情链向上移动代码下载 22:跟随下拉框的广告代码演示下载 23:交叉分离式广告代码演示下载 24:幻灯10个轮换代码演示下载 25:分组相关的导航代码1下载 26: 分组相关的导航代码2下载 27:分组相关的轮换演示下载 28:列表式广告代码演示下载 29:杂志式幻灯广告代码演示下载 30:影院模式幻灯广告代码演示下载 31:易趣产品幻灯广告代码演示下载 32:两侧翻牌的广告代码演示下载 33:div+css显示对联带关闭代码下载 34:文字导航广告代码演示下载 35:文字滚动消息广告代码下载 36:大幅商品展示广告代码下载 37:TOP排列幻灯广告代码下载 38:下拉显示幻灯广告代码下载 39:文字上翻幻灯广告代码下载 40:随数字快速翻动幻灯代码下载 41:随快速翻动幻灯代码下载 42:两边漂浮和中间漂浮组合下载 43:随机显示广告代码下载 44:可以设定播放速度的代码下载 45:很不错的漂浮广告代码下载 46:变换特效广告代码下载 47:鼠标移动提示的广告代码下载 48:漂亮的放GG代码的广告框架下载 49:破SP2弹窗24小时弹一次下载 50:定时关闭的背投广告代码下载 51:仿GG和百度的文字浮动广告下载 52:绕过XP关闭弹出代码下载 53:关闭弹出两窗口的代码下载 54:鼠标经过即弹出广告代码下载 55:按钮跳出广告代码下载 56:左边底部悬浮代码下载 57:滑动展开/收缩广告代码下载 58:点空白页面也弹出代码下载 59:置顶收栏关闭效果代码下载 60:新浪FLASH切换广告下载 61:不错的漂浮广告代码下载 62:24小时退弹一次的代码下载 63:顶部收缩广告效果yahoo-IE7下载 64:仿QQ消息弹出广告效果下载 65:不可阻止的退弹代码演示下载 66:网易顶部展出的大幅广告下载 67:包含flash的通栏滚动banner下载 68:MiniTabbedPages雅虎TAB下载 69:FLASH轮换播放器下载 70:flash+xml轮换效果下载 71:调用灵活的flash焦点图轮换下载 72:附带缩略图的JS轮换下载 73:可翻阅上一条下一条滚动下载 74:MSN左上角flash伸缩广告下载 75:雅虎社区4屏焦点轮换下载 76:搜狐娱乐flash焦点图广告下载 77:FLASH+XML迅雷影广告特效下载 78:韩国购物网FLASH滚动广告下载 79:Flash+XML滚动新闻代码下载 80:西安腾讯网flash焦点广告下载 81:四屏flash轮换代码下载 82:渐变轮换焦点图效果下载 83:CSS写的滚动下拉广告下载 84:MSN超酷flash轮换下载 85:沪江英语网3图弹性广告下载 86:SOHU体育flash轮换下载 87:MSN频道4屏新闻广告效果下载 88:用层实现的滚动条效果下载 89:迅雷网七屏flash广告轮换下载 90:奥林匹克运动会焦点广告下载 91:一种选项卡样式广告代码下载 92:网站页首可关闭广告条下载 93:flash无限展示广告下载 94:电子杂志首页flash焦点图下载 95:Zcom电子杂志flash焦点图下载 96:flash滑动焦点图广告代码下载 97:9格FLASH广告代码下载 98:MSN健康频道CSS标准焦点图下载 99:JS带缩略图的5屏轮换广告下载 100:JS4屏焦点图轮换代码下载 101:索尼中国Flash+Xml广告 下载 102:弹性菜单样式的展示 下载 103:带摘要的Flash代码下载 104:JS卷帘门效果下载 105:3d墙flash+xml 下载 106:360度旋转展示flash+xml 下载 107:带翻页的JS切换效果 下载 108:J

87,993

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧