Scenario: I am making a gallery for a news site.
I want some way to obscure images for users that aren’t logged.
CSS-filter blur seems like a good way to do it, but it doesn’t have good browser support…
Anybody have suggestions of another way to do it??
I can’t position a pseudo element over it, because I the gallery is draggable, and that would screw up the draggability…
Caniuse shows about 95% support for filter which is pretty good.
You could use the @supports media query for the filter and for non supporting browsers use the pseudo element method to shim a partially opaque background over the top of the image.
If you apply pointer-events:none to it then it won’t interfere with anything.
That’s just a couple of thought off the top of my head 
Here’s a rough demo of what I just mentioned.
or perhaps:
Anything done in the browser can be blocked in the browser. Most people would not know how but some of us could.
Yes of course if this is important then it should be carried out serverside rather than in the browser.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.