;(function ($) { $.fn.seeBigPicture = function (options) { var opts; var defaluts = { initialSlide:0, showButton:true,//是否显示左右按钮 showBottomPic:true,//是否将所有图片显示在底部 canSlide:false }; opts = $.extend({},defaluts, options); return this.each(function () { var img = $(this).find('img'); var swiperHtml = '' var bottomHtml = '' for(var i=0;i' if(opts.showBottomPic){ if(i==opts.initialSlide){ bottomHtml+='
' } else { bottomHtml+='
' } } } $('body').append('
\n' + '
\n' + '
'+swiperHtml+ '
' + (opts.showButton?'
':'') + '
' +bottomHtml+ '
') var bottomPic = $('#alertBigPicture .bottom-group').find('div') var swiperOpt = {} if(img.length>0){ if(opts.showButton){ swiperOpt = { // 如果需要前进后退按钮 nextButton: '.alert-button-next', prevButton: '.alert-button-prev', onSlideChangeEnd:function (swiper) { var index = swiper.activeIndex; bottomPic.eq(index).addClass('ac').siblings().removeClass('ac') var sum = 0; var isAc = false; bottomPic.each(function () { if($(this).is('.ac')){ isAc = true } else if(!isAc){ sum+=$(this).outerWidth(true) } }) $('#alertBigPicture .bottom-group').scrollLeft(sum-100) } } } swiperOpt.initialSlide = opts.initialSlide; var mySwiper = new Swiper ('.alert-big-picture-container',swiperOpt) if(!opts.canSlide){ $('.alert-big-picture-container').addClass('swiper-no-swiping') } } bottomPic.click(function () { var index = $(this).index() bottomPic.eq(index).addClass('ac').siblings().removeClass('ac') mySwiper.slideTo(index,100,false) }) $('#alertBigPicture').click(function (e) { if($(e.target).is('.alert-big-picture')||$(e.target).is('.swiper-slide')){ $('#alertBigPicture').remove() } }) }) //你自己的插件代码 }; })(jQuery);