Cristina1 Posted November 28, 2023 Share Posted November 28, 2023 Hi everybody, I'm trying to do an blur effect in the intersection between two divs. The goal that I want to get is like the image below. Can anyone help me? Thanks in advance. See the Pen qBgyvWR by Cristina-Corghi-the-bold (@Cristina-Corghi-the-bold) on CodePen Link to comment Share on other sites More sharing options...
mvaneijgen Posted November 28, 2023 Share Posted November 28, 2023 I would first build a proof of concept with just HTML and CSS, before you start introducing GSAP to the mix. I don't even know if this is possible and if it is I would figure it would probably not work in several browsers. Link to comment Share on other sites More sharing options...
Solution mvaneijgen Posted November 28, 2023 Solution Share Posted November 28, 2023 Yep, the CSS property you're looking for is called backdrop-filter: blur(10px) and is not widely supported https://developer.mozilla.org/en-US/docs/Web/CSS/filter Hope it helps and happy tweening! See the Pen bGzjZPN?editors=1100 by mvaneijgen (@mvaneijgen) on CodePen 3 Link to comment Share on other sites More sharing options...
Cristina1 Posted November 28, 2023 Author Share Posted November 28, 2023 Thank you! That was exactly what I was looking for Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now