Hey, I was wondering how to make an image blur on hover as well as have text appear. I’ve managed to add an interaction so the text appears when you hover but not sure how to do the blur.
Essentially I’m looking for this to happen when hovering over the image.
And then give the item you want to blur the class blur and that blurs it.
You can also duplicate the layer you want to blur, set the opacity to 0 and then on hover to 100 (of the blur class) and that makes it blur on hover but that still doesn’t blur the entire thing.
This is a topic i started about the blur effect, i still can’t seem to get it working though
Very strange, i made a test site a while ago where some of the sections had the blur class and that worked, but now all of a sudden the blur doesn’t work…
I honestly have no idea on how to do this, i suggested this as a feature for Webflow a while ago, don’t know if it got picked up.
That is very odd. I’m at a bit of a loss then. The only other way I can think of doing it is laying 2 images on top of each other, the bottom one blurred and adding a interaction on hover which turns the opacity down on the top image revealing the one underneath, just to give the impression it’s blurring.
Not ideal as I’ll have to add 2 different images but it could work.