ScrollBar Issue with Multiple Text Field Columns

programming flash
1

Hey - having a problem with this scrollbar which controls 3 dynamic text fields.
It scrolls properly using the up/down arrows but not with dragging scroll tab.
Also, when using the up/down arrows the scroll tab scrolls but to the full height of the stage until you either reach the top or bottom then it snaps back into place.

Here is the AS and I am also attaching the files.
Thanks in advance!

function loadXMLData(loaded) {
	if (loaded) {
		xmlNode = this.firstChild;
		timing = xmlNode.childNodes[0].childNodes[0].firstChild.nodeValue;
		sqft = xmlNode.childNodes[0].childNodes[1].firstChild.nodeValue;
		where = xmlNode.childNodes[0].childNodes[2].firstChild.nodeValue;
		column1Txt.htmlText = timing;
		column2Txt.htmlText = sqft;
		column3Txt.htmlText = where;
	} else {
		column1Txt.htmlText = "Sorry, the text was unable to load.";
		trace("Could not load XML file");
	}
}
xmlFile = new XML();
xmlFile.ignoreWhite = true;
xmlFile.onLoad = loadXMLData;
xmlFile.load("stuff.xml");
// ///////////////////////////////////
TextField.prototype.maxviewable = function() {
	if (this.maxscroll>1) {
		return this.bottomScroll;
	}
	var b = (this.html) ? this.bottomScroll+1 : this.bottomScroll;
	if (!this.length) {
		this.text = "»";
	}
	var out = Math.floor(this._height/(this.textHeight/b));
	if (this.text == "»") {
		this.text = "";
	}
	return out;
};

var max = column2Txt.maxscroll;
var vis = column2Txt.maxviewable();
var visPercent = (vis/max)*100;
//trace(visPercent)
dragger_mc._yscale = 12;//visPercent;

var topOfScroll = scrollbg_mc._y;
var dragHeight = scrollbg_mc._height-dragger_mc._height;
var amountPerScroll = dragHeight/max;
//trace(amountPerScroll)

dragger_mc.onPress = function() {
	startDrag(this, false, scrollbg_mc._x, scrollbg_mc._y, scrollbg_mc._x, (scrollbg_mc._y+scrollbg_mc._height)-this._height);
	this.onEnterFrame = function() {
		amountFromTop = this._y-topOfScroll;
		newScroll = Math.floor(amountFromTop/amountPerScroll)+1;
		column1Txt.scroll = newScroll;
		column2Txt.scroll = newScroll;
		column3Txt.scroll = newScroll;
	};
};
dragger_mc.onRelease = dragger_mc.onReleaseOutside=function () {
	this.onEnterFrame = null;
	stopDrag();
};
down_mc.onPress = function() {
	this.onEnterFrame = function() {
		if (column2Txt.scroll<column2Txt.maxscroll) {
			column1Txt.scroll++;
			column2Txt.scroll++;
			column3Txt.scroll++;
			dragger_mc._y += amountPerScroll;
		} else {
			dragger_mc._y = topOfScroll+dragHeight;
		}
	};
};
down_mc.onRelease = down_mc.onReleaseOutside=function () {
	this.onEnterFrame = null;
};
up_mc.onPress = function() {
	this.onEnterFrame = function() {
		if (column1Txt.scroll>1) {
			column1Txt.scroll--;
			column2Txt.scroll--;
			column3Txt.scroll--;
			dragger_mc._y -= amountPerScroll;
		} else {
			dragger_mc._y = topOfScroll;
		}
	};
};
up_mc.onRelease = up_mc.onReleaseOutside=function () {
	this.onEnterFrame = null;
};
//
stop();