Hacker News new | ask | show | jobs
by chuckhendo 3302 days ago
I have no idea what you are talking about regarding Safari ignoring "filter: blur()" - it's supported it since 2012, just a few months after Chrome added it. In fact - I think at the time Chrome was still using Webkit.

"backdrop-filter" is a completely different thing. Rather than filtering the element itself, it filters all elements behind it. This is especially useful with blur. While you are correct that Safari is the only browser currently supporting it, it is part of the standard, although it's not yet finalized. Chrome also supports it if you enabled "Experimental Web Features"

1 comments

Safari "filter:blur()" is not compatible with background images. Background images on a filtered element will disappear. While "backdrop-filter" is not compatible with any other browser.

You either have to choose Safari (which only has a leading-yet-declining share on Macs) or every other browser to support.

I literally just tried this in Safari 10.1.1: https://codepen.io/chuckhendo/pen/NgGZqg

Maybe it affects older versions of Safari, but I don't recall having run into it.

"backdrop-filter" is irrelevant - it's an entirely different feature.

It works now I guess, but Safari has quirks I've seen time and time again where things don't work as they should.

I'm also hesitant to call it "fixed" considering it happened just last month and YMMV with a one-element pen.