		
		$.allowscroll = new Array();
		$.scrolldirection = new Array();
		$.allowscroll_scrollbutton = false;
		
		function scroll_attach(id,direction){
			$.allowscroll[id] = false;
			$.scrolldirection[id] = direction;
			// window.allowscroll.push(id);
			// window.allowscroll_scrollbutton = false;
			$('div#'+id+'_scrollcontainer').mousedown(function(e){
				var id = $(this).attr('id');
				id = id.split('_scrollcontainer');
				id = id[0];
				// alert(id);
				$.allowscroll[id] = true;
				$.allowscroll_scrollbutton = id;
				// scroll_button(e,'div#'+id+'_scrollbutton','div#'+id+'_inner_container',$.scrolldirection[id],true);
				scroll_button(e,'div#'+$.allowscroll_scrollbutton+'_scrollbutton','div#'+$.allowscroll_scrollbutton+'_inner_container',$.scrolldirection[$.allowscroll_scrollbutton],true);
				return false;
			});
			$('div#'+id+'_scrollbutton').mousedown(function(e){
				var id = $(this).parent().attr('id');
				id = id.split('_scrollcontainer');
				id = id[0];
				// alert(id);
				$.allowscroll[id] = true;
				$.allowscroll_scrollbutton = id;
				// alert($.scrolldirection[$.allowscroll_scrollbutton]);
				// scroll_button(e,'div#'+$.allowscroll_scrollbutton+'_scrollbutton','div#'+$.allowscroll_scrollbutton+'_inner_container',$.scrolldirection[$.allowscroll_scrollbutton],false);
				e.stopPropagation();
				return false;
			});
			// $('div#scrollbutton').mouseup(function(e){
				// window.allowscroll_scrollbutton = false;
				// e.stopPropagation();
				// return false;
			// });
			$(document).mousemove(function(e){
				// alert('test');
				if ($.allowscroll_scrollbutton != false){
					scroll_button(e,'div#'+$.allowscroll_scrollbutton+'_scrollbutton','div#'+$.allowscroll_scrollbutton+'_inner_container',$.scrolldirection[$.allowscroll_scrollbutton],false);
				}
			});
			$(document).mouseup(function(e){
				$.each($.allowscroll,function(index, value){
					if ($.allowscroll[index] == true){
						$.allowscroll[index] = false;
					}
				});
				$.allowscroll_scrollbutton = false;
				$('div.scrollbutton_x').each(function(){
					var background_hover = $(this).css("background-image");
					if (background_hover.match("_clicked")){
						background_hover = background_hover.split('_clicked');
						$(this).css("background-image",background_hover[0]+".png");
					}
				});
				$('div.scrollbutton_y').each(function(){
					var background_hover = $(this).css("background-image");
					if (background_hover.match("_clicked")){
						background_hover = background_hover.split('_clicked');
						$(this).css("background-image",background_hover[0]+".png");
					}
				});
			});
		}
		
		function scroll_button(e,button,container,direction,full){
			e.stopPropagation();
			var left = $(button).parent().offset().left;
			var top = $(button).parent().offset().top;
			var maxY = $(button).parent().outerHeight();
			$(container).css('position','relative');
			// alert(direction);
			if (direction == 'X'){
				var maxX = $(button).parent().outerWidth()-$(button).outerWidth();
				var marginLeft = e.pageX-left-($(button).outerWidth()/2);
				var outerperpercentX = $(button).parent().outerWidth()/100;
				var maxperpercentX = maxX/100;
				var X = marginLeft;
				var percentX = 100 * (marginLeft / maxX);
				if (percentX > 100){
					percentX = 100;
					X = maxX;
				}else if(percentX < 0){
					percentX = 0;
					X = 0;
				}else{
				}
				var moveMaxX = $(container).outerWidth()-$(container).parent().outerWidth();
				var moveLeft = 0-eval(((moveMaxX/100)*percentX));
				$(button).css("left",X+"px");
				var background_hover = $(button).css("background-image");
				if (!background_hover.match("_clicked")){
					background_hover = background_hover.split('.png');
					$(button).css("background-image",background_hover[0]+"_clicked.png");
				}
				$(container).css('left',moveLeft+"px");
			}else{
				var maxY = $(button).parent().outerHeight()-$(button).outerHeight();
				var marginTop = e.pageY-top-($(button).outerHeight()/2);
				var outerperpercentY = $(button).parent().outerHeight()/100;
				var maxperpercentY = maxY/100;
				var Y = marginTop;
				var percentY = 100 * (marginTop / maxY);
				if (percentY > 100){
					percentY = 100;
					Y = maxY;
				}else if(percentY < 0){
					percentY = 0;
					Y = 0;
				}else{
				}
				var moveMaxY = $(container).outerHeight()-$(container).parent().outerHeight();
				var moveTop = 0-eval(((moveMaxY/100)*percentY));
				$(button).css("top",Y+"px");
				var background_hover = $(button).css("background-image");
				if (!background_hover.match("_clicked")){
					background_hover = background_hover.split('.png');
					$(button).css("background-image",background_hover[0]+"_clicked.png");
				}
				$(container).css('top',moveTop+"px");
			}
		}
