I am creating a historical time line site similar to the
image attached. There will be a main time line across the center of
the page with buttons that allow the user to click to the next or
previous decade. There is also a smaller time line above that will
show the user where they are but they will also be able to click
and drag the smaller version to navigate the main time line. My
question is how do I tie the smaller time line to the larger one?
How do I make it so that when you click on the main time line to go
to the next decade it also moves the one up top in relation to
where you are? All of the info will be pulled from XML and there
will be a mask that moves to reveal the different sections of the
site. Thank you!
Use a ratio. Change the small scoller's x postion based on
the position of the large scroller's x multiplied by the ratio. So
if the small scroller were exactly 1/2 the size of the larger, the
AS would look like this:
smallScroller._x = largeScroller._x * 0.5;
Obviously this example would only work if both were located
at 0 in x and does not account for differences in their locations
or nesting inside movieclips but should give you the general idea.
Nor does it show a way to animate the movement to the new location,
for which you coul duse the Tween class or an animation class like