$(function(){ $('div#slider').scrollGallery({ sliderHolder: 'div.slide_holder div.mask', generatePagination:'div.pag_frame', btnPrev:'a.previous', btnNext:'a.next' }); }) // scrolling gallery plugin jQuery.fn.scrollGallery = function(_options){ var _options = jQuery.extend({ sliderHolder: '>div', slider:'>ul', slides: '>li', pagerLinks:'div.pager a', btnPrev:'a.link-prev', btnNext:'a.link-next', activeClass:'selected', disabledClass:'disabled', generatePagination:'div.pg-holder', curNum:'em.scur-num', allNum:'em.sall-num', circleSlide:true, pauseClass:'gallery-paused', pauseButton:'none', pauseOnHover:true, autoRotation:true, stopAfterClick:false, switchTime:5000, duration:500, easing:'swing', event:'click', afterInit:false, vertical:false, step:false },_options); return this.each(function(){ // gallery options var _this = jQuery(this); var _sliderHolder = jQuery(_options.sliderHolder, _this); var _slider = jQuery(_options.slider, _sliderHolder); var _slides = jQuery(_options.slides, _slider); var _btnPrev = jQuery(_options.btnPrev, _this); var _btnNext = jQuery(_options.btnNext, _this); var _pagerLinks = jQuery(_options.pagerLinks, _this); var _generatePagination = jQuery(_options.generatePagination, _this); var _curNum = jQuery(_options.curNum, _this); var _allNum = jQuery(_options.allNum, _this); var _pauseButton = jQuery(_options.pauseButton, _this); var _pauseOnHover = _options.pauseOnHover; var _pauseClass = _options.pauseClass; var _autoRotation = _options.autoRotation; var _activeClass = _options.activeClass; var _disabledClass = _options.disabledClass; var _easing = _options.easing; var _duration = _options.duration; var _switchTime = _options.switchTime; var _controlEvent = _options.event; var _step = _options.step; var _vertical = _options.vertical; var _circleSlide = _options.circleSlide; var _stopAfterClick = _options.stopAfterClick; var _afterInit = _options.afterInit; // gallery init if(!_slides.length) return; var _currentStep = 0; var _sumWidth = 0; var _sumHeight = 0; var _hover = false; var _stepWidth; var _stepHeight; var _stepCount; var _offset; var _timer; _slides.each(function(){ _sumWidth+=$(this).outerWidth(true); _sumHeight+=$(this).outerHeight(true); }); // calculate gallery offset function recalcOffsets() { if(_vertical) { if(_step) { _stepHeight = _slides.eq(_currentStep).outerHeight(true); _stepCount = Math.ceil((_sumHeight-_sliderHolder.height())/_stepHeight)+1; _offset = -_stepHeight*_currentStep; } else { _stepHeight = _sliderHolder.height(); _stepCount = Math.ceil(_sumHeight/_stepHeight); _offset = -_stepHeight*_currentStep; if(_offset < _stepHeight-_sumHeight) _offset = _stepHeight-_sumHeight; } } else { if(_step) { _stepWidth = _slides.eq(_currentStep).outerWidth(true)*_step; _stepCount = Math.ceil((_sumWidth-_sliderHolder.width())/_stepWidth)+1; _offset = -_stepWidth*_currentStep; if(_offset < _sliderHolder.width()-_sumWidth) _offset = _sliderHolder.width()-_sumWidth; } else { _stepWidth = _sliderHolder.width(); _stepCount = Math.ceil(_sumWidth/_stepWidth); _offset = -_stepWidth*_currentStep; if(_offset < _stepWidth-_sumWidth) _offset = _stepWidth-_sumWidth; } } } // gallery control if(_btnPrev.length) { _btnPrev.bind(_controlEvent,function(){ if(_stopAfterClick) stopAutoSlide(); prevSlide(); return false; }); } if(_btnNext.length) { _btnNext.bind(_controlEvent,function(){ if(_stopAfterClick) stopAutoSlide(); nextSlide(); return false; }); } if(_generatePagination.length) { _generatePagination.empty(); recalcOffsets(); var _list = $('