Streaming live at 10am (PST)

Image Animation in Hero Background


#1

I'm wondering if it's possible to add an animated image (possibly) an interacted animated image behind the text established on my companies website hero section?

For example - think of rocket (off grey color) the moment a mouse hovers over it - it will take off and disappear off the hero section. That's just one image of atleast 4 that I'm considering attempted to implement on to the Home page hero banner. Only when the page is refreshed will it reset.

Let me know your thoughts. Below is the link to my company home page.

http://goo.gl/m7BYIw

Thanks guys!


#2

Hi @SBobby, thanks for the question, I am sure you will get comments on this smile

Yes it is possible, You can create such a thing using interactions alone if you just need simple interactions. If you need more complex interactions, you might need to use some jQuery. It really depends what your exact idea is, and how you want it to work.

Here is a good tutorial on the basic hover trigger, which can be used when someone hovers over your rocket.. With the right interaction, you can apply different effects to the rocket such as moving it out of position or changing the opacity of the element and more...

http://tutorials.webflow.com/hover-trigger

All of our interaction tutorials are located at:

http://tutorials.webflow.com/interactions

I hope that helps. I am sure others will have good ideas to share smile

Cheers, Dave


#3