I have a project where I need to show the progress of a, well, project. The project has seven specific stages that it must pass through.
What I would like to do is have an animated arrow move from left to right across the screen until it hits a target on the right side. At any time a user can navigate to the page to see what stage the project is up to. I'd like the user to see the arrow move to that point and stop. Unfortunately I am not a designer nor animator. I have looked at tweening but that just seems to be able to move an object (like the arrow) from one place to another but I would like the arrow to elongate as it moves (ie. The head and tail stays the same but the shaft elongates). I have PNG images of the arrow and target and can break the arrow into a head, a tail and a 1-pixel wide shaft. If anyone has any ideas on how to accomplish it, examples/tutorials or sites I can visit I would be most appreciative. (I have been googling all day but can't find anything useful)

