(function($) {
	$.fn.scroll = function(options) {
		
		options = $.extend({
			width: 600,
			height: 100,
			widthbar: 13,
			path: "/i/scroll",
			btnup: "btn-up.gif",
			btndn: "btn-dn.gif",

			bar_scroll_top:    "btn_scroll_top.gif",
			bar_scroll_bg:     "btn_scroll_bg.gif",
			bar_scroll_middle: "dragbar-middle.gif",
			bar_scroll_bottom: "btn_scroll_bottom.gif",
			
			dragbar: "dragbar.gif",
			
			style: "border: 1px solid transparent;"

		}, options);

		options.btnup             = options.path + "/" + options.btnup;
		options.btndn             = options.path + "/" + options.btndn;
		options.bar_scroll_top    = options.path + "/" + options.bar_scroll_top;
		options.bar_scroll_bg     = options.path + "/" + options.bar_scroll_bg;
		options.bar_scroll_middle = options.path + "/" + options.bar_scroll_middle;
		options.bar_scroll_bottom = options.path + "/" + options.bar_scroll_bottom;
		options.dragbar           = options.path + "/" + options.dragbar;

		var divid =  $(this).attr("id");
		var divpos = $(this).position().top;
		var divheight = $(this).height();

		//if (divheight < options.height) return;
		if (divid == "") {
			divid = "scrolling11" + Math.floor( Math.random( ) *  100000);
			$(this).attr("id", divid);
		};

		bar = '<table cellpadding="0" cellspacing="0" width="100%" border="0" id="barheight'+divid+'">';
		bar+= '<tr><td height="4" style="background: url('+options.bar_scroll_top+') no-repeat; padding: 0px;"></td></tr>';
		bar+= '<tr><td style="background: url('+options.bar_scroll_bg+') repeat-y; padding: 0px;"><img src="'+options.bar_scroll_middle+'"></td></tr>';
		bar+= '<tr><td height="4" style="background: url('+options.bar_scroll_bottom+') no-repeat; padding: 0px;"></td></tr>';
		bar+= '</table>';
					
		scrollbar = '<td width="'+options.widthbar+'" style="padding: 0px;"><table height="'+options.height+'" width="'+options.widthbar+'" cellpadding="0" cellspacing="0" border="0" style="margin-left: 2px;">';
		scrollbar+= '<tr><td width="13" height="15" style="padding: 0px;"><img src="'+options.btnup+'" border="0" id="srolling_up'+divid+'"></td></tr>';
		scrollbar+= '<tr><td style="background: url('+options.dragbar+') center repeat-y; padding: 0px;" valign="top">'+bar+'</td></tr>';
		scrollbar+= '<tr><td width="13" height="15" style="padding: 0px;"><img src="'+options.btndn+'" border="0" id="srolling_down'+divid+'"></td></tr>';
		scrollbar+= '</table></td>';
		
		divscroll = '<table border="0" cellpadding="0" cellspacing="0" width="'+options.width+'" height="'+options.height+'">';
		divscroll+= '<tr><td style="padding: 0px;"><div style="position:relative; overflow:hidden; width:'+(options.width-options.widthbar)+'px; height:'+options.height+'px; '+options.style+' ">';
		divscroll+= '<div id="scrolling_content'+divid+'" style="position:absolute; left:0px; top:0px; visibility: visible;">'+$(this).html()+'</div></div></td>'+scrollbar+'</tr><table>';
		
		$(this).replaceWith(divscroll);
	
		var textheight = parseInt($("#scrolling_content"+divid).innerHeight());	

		var texttop = options.height-textheight;
		texttop = (texttop<0?texttop:0);
		
		var barheight = 8;
		var barbutton = 15;
		
		var barmax = options.height-barbutton*2;
		var barmove = false;
	
		if (textheight>options.height)
		{	
			barcur = barmax*options.height/textheight + 10;
		} else {
			barcur = barmax;
		}
		
		var bartop = barmax-barcur;
		
		if (bartop>barmax)
		{
			bartop=barmax-barheight;
		}

		$("#barheight"+divid).css({
			'height' : barcur
		});
		
		
		$("#srolling_down"+divid).bind("mouseover", function(e) {
			if (!barmove)
			{
				$("#barheight"+divid).animate({marginTop: bartop+"px"}, 1500)
				$("#scrolling_content"+divid).animate({"top": texttop+"px"}, 1500);
			}
		});
				
	
		$("#srolling_up"+divid).bind("mouseover", function(e) {
			if (!barmove)
			{
				$("#barheight"+divid).animate({marginTop: "0px"}, 1500);
				$("#scrolling_content"+divid).animate({"top": "0px"}, 1500);
			}
		});
		
		$("#srolling_down"+divid+", #srolling_up"+divid).bind("mouseout", function(e) {
			if (!barmove)
			{
				$("#scrolling_content").stop();
				$("#barheight").stop();
			}
		});		

		$("#srolling_down"+divid+", #srolling_up"+divid).bind("click", function(e) {		
			return false;
		});

		$("#barheight"+divid).bind("mousedown", function(e) {
			
			barcurtop = parseInt($("#barheight"+divid).css('marginTop'));
			barcurtop = (isNaN(barcurtop)?0:barcurtop);
			barcurtop = (e.pageY-divpos-barbutton)-barcurtop;
					
			$("body").bind("mousemove", function(e) {
				
				barmove = true;		
				_margintop = (e.pageY-divpos-15)-barcurtop;
				
				if (_margintop>bartop)
				{
					_margintop = bartop;
				}
				else if (_margintop<0)
				{
					_margintop=0;
				}
				
				$("#barheight"+divid).css({
					marginTop: _margintop
				});				
			
				_margintop = _margintop*texttop/bartop;
											
				$("#scrolling_content"+divid).css({
					"top": _margintop
				});

				$("body").one("mouseup", function(e) {
					$("body").unbind("mousemove");
					barmove = false;
				});
				
				return false;
			});
			return false;
		});
		
	}
					
})(jQuery);
