( function($) { $.tiny = $.tiny||{}; $.tiny.scrollbar = {options:{axis:'y',wheel:40,scroll:true,size:'auto',sizethumb:'auto'}}; $.fn.tinyscrollbar=function(options){var options=$.extend({},$.tiny.scrollbar.options,options);this.each(function(){$(this).data('tsb',new Scrollbar($(this),options));});return this;}; $.fn.tinyscrollbar_update=function(sScroll){return $(this).data('tsb').update(sScroll);}; function Scrollbar(root,options) { var oSelf=this; var oWrapper=root; var oViewport={obj:$(options.viewport,root)}; var oContent={obj:$(options.overview,root)}; var oScrollbar={obj:$('.scrollbar',root)}; var oTrack={obj:$('.track',oScrollbar.obj)}; var oThumb={obj:$('.thumb',oScrollbar.obj)}; var sAxis=options.axis=='x',sDirection=sAxis?'left':'top',sSize=sAxis?'Width':'Height'; var iScroll,iPosition={start:0,now:0},iMouse={}; function initialize() { oSelf.update(); setEvents(); return oSelf; } this.update=function(sScroll) { oViewport[options.axis]=oViewport.obj[0]['offset'+sSize]; oContent[options.axis] = oContent.obj[0]['scroll'+sSize]; /* Adding border - Start */ oContent[options.axis] += oViewport.obj.outerHeight() - oViewport.obj.innerHeight(); /* Adding border - End */ oContent.ratio=oViewport[options.axis]/oContent[options.axis]; oScrollbar.obj.toggleClass('disable',oContent.ratio>=1); oTrack[options.axis]=options.size=='auto'?oViewport[options.axis]:options.size; oThumb[options.axis]=Math.min(oTrack[options.axis],Math.max(0,(options.sizethumb=='auto'?(oTrack[options.axis]*oContent.ratio):options.sizethumb))); oScrollbar.ratio=options.sizethumb=='auto'?(oContent[options.axis]/oTrack[options.axis]):(oContent[options.axis]-oViewport[options.axis])/(oTrack[options.axis]-oThumb[options.axis]); iScroll=(sScroll=='relative'&&oContent.ratio<=1)?Math.min((oContent[options.axis]-oViewport[options.axis]),Math.max(0,iScroll)):0; iScroll=(sScroll=='bottom'&&oContent.ratio<=1)?(oContent[options.axis]-oViewport[options.axis]):isNaN(parseInt(sScroll))?iScroll:parseInt(sScroll); setSize(); }; function setSize() { oThumb.obj.css(sDirection,iScroll/oScrollbar.ratio); oContent.obj.css(sDirection,-iScroll); iMouse['start']=oThumb.obj.offset()[sDirection]; var sCssSize=sSize.toLowerCase(); oScrollbar.obj.css(sCssSize,oTrack[options.axis]); oTrack.obj.css(sCssSize,oTrack[options.axis]); oThumb.obj.css(sCssSize,oThumb[options.axis]); }; function setEvents() { oThumb.obj.bind('mousedown',start); //[+]oViewport.obj.bind('mousedown',start); oThumb.obj[0].ontouchstart=function(oEvent) { oEvent.preventDefault(); oThumb.obj.unbind('mousedown'); start(oEvent.touches[0]); return false; }; oTrack.obj.bind('mouseup',drag); if(options.scroll&&this.addEventListener) { oWrapper[0].addEventListener('DOMMouseScroll',wheel,false); oWrapper[0].addEventListener('mousewheel',wheel,false); } else if(options.scroll){oWrapper[0].onmousewheel=wheel;} }; function start(oEvent) { iMouse.start=sAxis?oEvent.pageX:oEvent.pageY; var oThumbDir=parseInt(oThumb.obj.css(sDirection)); iPosition.start=oThumbDir=='auto'?0:oThumbDir; $(document).bind('mousemove',drag); document.ontouchmove=function(oEvent) { $(document).unbind('mousemove'); drag(oEvent.touches[0]); }; $(document).bind('mouseup',end); oThumb.obj.bind('mouseup',end); oThumb.obj[0].ontouchend=document.ontouchend=function(oEvent) { $(document).unbind('mouseup'); oThumb.obj.unbind('mouseup'); end(oEvent.touches[0]); }; return false; }; function wheel(oEvent) { if(!(oContent.ratio>=1)) { //[-]oEvent=$.event.fix(oEvent||window.event); var iDelta=oEvent.wheelDelta?oEvent.wheelDelta/120:-oEvent.detail/3; iScroll-=iDelta*options.wheel; iScroll=Math.min((oContent[options.axis]-oViewport[options.axis]),Math.max(0,iScroll)); oThumb.obj.css(sDirection,iScroll/oScrollbar.ratio);oContent.obj.css(sDirection,-iScroll); oEvent.preventDefault(); }; }; function end(oEvent) { $(document).unbind('mousemove',drag); $(document).unbind('mouseup',end); oThumb.obj.unbind('mouseup',end); document.ontouchmove=oThumb.obj[0].ontouchend=document.ontouchend=null; return false; }; function drag(oEvent) { if(!(oContent.ratio>=1)) { iPosition.now=Math.min((oTrack[options.axis]-oThumb[options.axis]),Math.max(0,(iPosition.start+((sAxis?oEvent.pageX:oEvent.pageY)-iMouse.start)))); iScroll=iPosition.now*oScrollbar.ratio;oContent.obj.css(sDirection,-iScroll); oThumb.obj.css(sDirection,iPosition.now);; } return false; }; return initialize(); }; } ) (jQuery);