/* banner1效果 */ (function($) { //默认参数 var defaluts = { box: "box", list: "list", //banner-img-list buttom: "buttom", left_btn: "left_btn", //左按钮 right_btn: "right_btn", //右按钮 speed: "speed", // 时间 }; $.fn.extend({ /* 带缩略图的轮播效果 */ "thumbnailimg": function(options) { var opts = $.extend({}, defaluts, options); //使用jquery.extend 覆盖插件默认参数 // console.log(opts); //遍历匹配元素的集合 return this.each(function() { // console.log(this); var nav_num = ''; var count = $(opts.list).find("li").length; $(opts.list).find("li").eq(0).css("display", "block"); $(opts.list).find("li").each(function() { var index = $(this).index() + 1; nav_num += '
  • ' + index + '
  • '; }); $(opts.buttom).append(nav_num); $(opts.buttom).find("li").first().addclass("num_hover"); $(opts.buttom).find("li").hover(function() { sw = $(opts.buttom).find("li").index(this); myshow(sw); }); $(opts.left_btn).click(function() { clearinterval(mytime); sw -= 1; if (sw == -1) { sw = count - 1; } myshow(sw); }); $(opts.right_btn).click(function() { clearinterval(mytime); sw++; if (sw == count) { sw = 0; } myshow(sw); mytime; }); function myshow(i) { $(opts.buttom).find("li").eq(i).addclass("num_hover").siblings().removeclass("num_hover"); $(opts.list).find("li").eq(i).stop(true, true).fadein(opts.speed).siblings("li").fadeout(opts.speed); } var mytime = 0; //滑入停止动画,滑出开始动画 $(opts.list).hover(function() { if (mytime) { clearinterval(mytime); } }, function() { mytime = setinterval(function() { myshow(sw); sw++; if (sw == count) { sw = 0; } }, 3000); }); //自动开始 var sw = 0; mytime = setinterval(function() { myshow(sw); sw++; if (sw == count) { sw = 0; } }, 2000); }); } }); })(jquery);