function scrollBarJq(containerId,subConteinerId,wrapperId,scrollBarId,scUpId,scDownId,scHandleId,scBackId){


			var posY = 0;
			var tarY = 0;
			var handlePosY = 0;
			var step = 50;
			var pressInterval = 100;
			var moveInterval = 50;
			var decrease = 0.2;
			var isUpBtnPress = false;
			var isDownBtnPress = false;
			var timerScrollUp = null;
			var timerScrollDown = null;
			var timerScrollMove = null;
			var container = "#"+containerId ;
			var subConteiner = "#"+subConteinerId;
			var wrapper = "#"+wrapperId;
			var handle = "#"+scHandleId;
			var back  = "#"+scBackId;
			var isHandleDragging = false;
			var scrollBar = "#"+scrollBarId;
			var scrollUpbtn = "#"+scUpId;
			var scrollUpbtnHeight = $(scUpId).height();
			var scrollDownbtn = "#"+scDownId;
			var scrollDownbtnHeight = $(scDownId).height();
			var scrollBarTop = 198;
			var scrollBarLeft = 755;
			var scrollHandleHeight = 12;
			var scrollBarHeight = 540;
			var scrollBarBackHeight ;

			function scrollUp(){
				if(isUpBtnPress){
					tarY+=step;
					if(tarY>0) tarY = 0;
					timerScrollUp = window.setTimeout(scrollUp,pressInterval);
					if(timerScrollMove ==null){
						scrollMove();
					}
				}
			}
			
			this.scrollTop = function(){
					tarY = 0;
					timerScrollUp = window.setTimeout(scrollUp,pressInterval);
					if(timerScrollMove ==null){
						scrollMove();
					}
			}
			
			this.reset = function(){
				$(container).style.marginTop = '0px';
				$(handle).style.top = '0px';
				handlePosY = 0;
				posY = 0;
				tarY=0;
				isUpBtnPress = false;
				isDownBtnPress = false;
				clearTimeout(timerScrollUp);
				clearTimeout(timerScrollDown);
			}

			function scrollDown(){
				if(isDownBtnPress){
					tarY-=step;
					if(tarY<$(wrapper).height()-$(container).height()) tarY =$(wrapper).height()-$(container).height();
					timerScrollDown = window.setTimeout(scrollDown,pressInterval);
					if(timerScrollMove ==null){
						scrollMove();
					}
				}
			}

			this.pressBtn = function(n){ //n=0:up n=1:down
				if(n==0){
					isUpBtnPress = true;
					scrollUp();
				}
				if(n==1){
					isDownBtnPress = true;
					scrollDown();
				}
			}

			this.releaseBtn = function(){
				isUpBtnPress = false;
				isDownBtnPress = false;
				clearTimeout(timerScrollUp);
				clearTimeout(timerScrollDown);
			}
			
			this.scrollMoveTo = function(n){
				tarY=n;
				if(timerScrollMove ==null){
					scrollMove();
				}
			}


			function scrollMove(){
				if($(wrapper).height()<$(container).height()){
					posY += (tarY-posY)*decrease;
					$(container).css("margin-top",posY+"px");
					if(subConteiner!=''){
						$(subConteiner).css("margin-top",posY+"px");
					}
					if(Math.abs(tarY-posY)>0.5){
						timerScrollMove = window.setTimeout(scrollMove,moveInterval);
						if(!isHandleDragging){
							handlePosY = (-1*posY/($(container).height()-$(wrapper).height()))*(scrollBarBackHeight-scrollHandleHeight);
							$(handle).css("top",handlePosY+"px");
						}
					}
					else{
						posY = tarY;
						$(container).css("margin-top",posY+"px");	
						if(subConteiner!=''){			
							$(subConteiner).css("margin-top",posY+"px");
						}
						timerScrollMove = null;
					}
					
					checkSection(posY);
					
				}
				
			}


			this.initSc=function(){
	
				scrollBarBackHeight = $(back).height();
				scrollHandleHeight = scrollBarBackHeight * $(wrapper).height() /$(container).height() ;

				$(handle).css("height",scrollHandleHeight);

				
				//for jQuery
				var mySlide3 = $(back).slider({
	
      			
      				minValue: 0, 
      				maxValue: $(container).height() - $(wrapper).height(), 
      				slide: function (ev, ui) {
        				$(container).css('margin-top', '-' + ui.value + 'px');
        				tarY = posY= -1*ui.value;
						scDragStart()
						scrollMove();
      				}, 
      				stop: function (ev, ui) {
        				$(container).css('margin-top', '-' + ui.value + 'px');
        				tarY = posY= -1*ui.value;
        				scDragEnd()
     				}
      			});
			    
				
			}
			
			function scDragStart(){
				isHandleDragging = true;
			}
			function scDragEnd(){
				isHandleDragging = false;
			}

			function dispValue(event){
				if(isHandleDragging){

						handlePosY = scrollBarTop-$(scrollUpbtn)-scrollHandleHeight/2;
						if(handlePosY<0)handlePosY=0;
						if(handlePosY>scrollBarBackHeight-scrollHandleHeight)handlePosY=scrollBarBackHeight-scrollHandleHeight;
						tarY = -1*($(container).height() - $(wrapper).height())* handlePosY/(scrollBarBackHeight-scrollHandleHeight);
						if(timerScrollMove ==null){
							scrollMove();
						}
						$(handle).css("top",handlePosY+"px");;
				}
			}
			
			this.hidden =function(){
				$(scrollBarId).style.display = 'none';
			}
			this.show = function(){
				$(scrollBarId).style.display = 'block';
			}
}
