Scroll two movieClips with one Bar

1

I’m using the code from the Scroll tutorial but I’m trying to modify it because I have two movieclips which need to be scrolled. They have different heights and the maskedview for each content is a different height. I’m trying to get it so that when the scrollFace is at 30%(or any pecentage) of the bar, then content1 & 2 are at the 30% position of their respective content.

scrolling = function () { 
var scrollHeight:Number = scrollTrack._height; 
var contentHeight:Number = contentMain._height;//// 
var scrollFaceHeight:Number = scrollFace._height; 
var maskHeight:Number = maskedView._height; ////
var initPosition:Number = scrollFace._y=scrollTrack._y; 
var initContentPos:Number = contentMain._y; //////
var finalContentPos:Number = maskHeight-contentHeight+initContentPos; //////
var left:Number = scrollFace._x; 
var top:Number = scrollTrack._y; 
var right:Number = scrollFace._x; 
var bottom:Number = scrollTrack._height-scrollFaceHeight+scrollTrack._y; 
var dy:Number = 0; 
var speed:Number = 10; 
var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight); /////
 
scrollFace.onPress = function() { 
var currPos:Number = this._y; 
startDrag(this, false, left, top, right, bottom); 
this.onMouseMove = function() { 
dy = Math.abs(initPosition-this._y); ///////
contentMain._y = Math.round(dy*-1*moveVal+initContentPos);
contentMain2._y = Math.round(dy*-1*moveVal+initContentPos);///////I think this is where the change needs to be at
};
}; 
scrollFace.onMouseUp = function() { 
stopDrag(); 
delete this.onMouseMove;
};
}; 
scrolling();