Progress bar-like animation

Hi there,

I have a sort of 'progress bar' or 'loading bar' that is higher or lower (scales Y) depending on the x-position of the slider.

The 'progress bar' is named 'meter2' and inside of 'meter2' is the bar itself named 'inner'. When the slider is moved from left to right (which changes the x-co ords), the 'inner' should scale Y accordingly.

So far I have almost made it happen. But for some reason when I use 'scaleY' it scales from the middle so both sides of the 'inner' are scaled instead of just the top part.

Also I think my maths is a little off.

Here's my code the part of my code that's most important.

function onMouseMove1(evt){
var item = evt.currentTarget;
var meter = root.meter2.inner;
if (item.drag){
item.x = Math.max(bounds.x, Math.min(bounds.x + bounds.width - handleWidth, evt.stageX));
meter.scaleY = item.x * 0.1;
var dif = person.x - item.x;
if(dif < 250){
finished = true;
}
}
}

Any help is greatly appreciated!

Cheers.