Parallax effect not working with backdrop filter

[varlevi]

Hi! Great project you have here. I've loved using it, but have one problem. I set up the parallax effect as instructed by the demo page (I also made the effect more dramatic by increasing the translateZ value). for a while, everything worked fine, but then I added a backdrop-filter: blur(); effect on the container element and the inner element no longer sticks out like before. any idea why this is happening?

[manastitious]

I am facing the same issue, have you come up with any workaround? @varlevi

[varlevi]

Unfortunately, I have not. I ended up just using a transparent background with no blur. Sorry I couldn't be of more help!

[pieter-biesemans]

CSS filters and 3D do not seem to play nice: https://css-tricks.com/things-watch-working-css-3d/

A possible workaround could be to stack two elements on top of each other. One for the background with the filter, and one for the content with stacking. But this is not easy if you don't have elements with exact widths and heights.