Streaming live at 10am (PST)

Need help with hover state


#1

I would like to get some help, this is probably very complicated stuff I ask, but I will appreciate any help with this.

I want to create the hover animation effect similar to the website I will provide beneath. I stuck on the heading inside each project which I made with absolute position. The texts should move to the center on hover and must be disabled on original state.
Thanks!!!

Site Example: https://tonik.pl/

My website: https://preview.webflow.com/preview/portfolio-bae4d3?preview=4fcf112fcdde1d8bac963ce4b734d286


#2

Take a look at the small video I created to explain how to do that:


#3

I super appreciate your time and effort to help me, this was pretty useful but I encountered few obstacles and maybe a bug.
First of all, i made also hover blur effect which seams work pretty fine, but this disables your animation.
Also when you go to the website link there, some weird stuff happening. Somehow when you hover over nav bar, it triggers all headings of a project and brakes the logic.
I didn’t find a way to explain it.

http://portfolio-bae4d3.webflow.io/

https://preview.webflow.com/preview/portfolio-bae4d3?preview=4fcf112fcdde1d8bac963ce4b734d286


#4

It’s just a matter of structure and pointing the right elements for your animations. Check the following video: