Trying to create an interactive animation without using javascript and need some tips

I have to create an interactive animation that people can move an hockey puck to a hockey goal or around and depending in which area they move it, a different image will show.

Right now, I’m able to move the puck all over the scene. Also, I’ve set a click and mouse over action to three different areas that trigger different timelines (one timeline by area to show a different image). But, in fact, I would like that the puck command the action and not a mouse over or a click. Is it possible to do so without using javascript? I would like to keep it the more simple I can because I’m not too familiar with JavaScript.

See animation’s print screen and how i’ve set it with my hype file :


uploading your file with forum, dropbox or any service that would not need registration should be preferred …

1 Like

Not without using javascript I’m afraid.

If you need help then perhaps if you could share a document someone will be able to help you with the javascript needed. Or, look on the forums for possible solutions for controlling a timeline with position.


1 Like

Thanks for the answer! But I’ve put my Hype files and HTML in the new Dropbox link I’ve put above, if someone can give me little tricks, would be very appreciate!

I’ve put my print screens and my files in Dropbox. New link is above!

guess your setup is not to bad :smile:
simply move the puck behind the mouseoverareas (stackingorder). those areas have to be offscreen with timelines moving them to field when the puck is dragged and off when not dragged. should work. minor changes :slight_smile:

1 Like

OMG, you make my day!!! I know there would be a way of doing it with mouse over! I will try to do so and even to create an invisible mouse over area above the puck. Thanks a lot, I’ll try it and keep you in touch!