How to show an error to firefox users when loading my site?
Hi, I need to show an error (info line) to my website users if they try to load my website by Firefox. Something like this
But for Firefox users to lead them is the best experience if they open the website by another browser like chrome or etc.
Modified by robertnicjoo
Chosen solution
To support Firefox, you can add an SVG element with the same definition to the document. Here's a demo using your polygon:
https://www.jeffersonscher.com/res/clip-path-svg.html
That's going to be tricky if you need to provide a WordPress dashboard control to allow the theme user to free-form the shape, but if you are predefining the shapes, I think it would work.
Read this answer in context 👍 0All Replies (8)
Why would you want that? If your website doesn't function properly in Firefox (a browser with a significant number of users), the best solution would be to fix your website, instead of telling your visitors they can't use the browser of their choice.
askandanswer said
Why would you want that? If your website doesn't function properly in Firefox (a browser with a significant number of users), the best solution would be to fix your website, instead of telling your visitors they can't use the browser of their choice.
Do you always erase the question except answer it or just when you don't know the answer?!!
I need that notice in my site because FF doesn't support clip style while chrome and opera does. That's why.
Do you mean this, or something else:
https://developer.mozilla.org/docs/Web/CSS/clip
Are you using a script library or framework that already includes browser detection?
jscher2000 said
Do you mean this, or something else: https://developer.mozilla.org/docs/Web/CSS/clip Are you using a script library or framework that already includes browser detection?
Thanks for respond: I've this code (you can add it to any image you want to see the result) https://drive.google.com/open?id=0B_po6BMlWpt6c2cxeTd5dmVnTFk
and it works fine on chrome and opera even i tried by adding new line using clip-path still not works on Fire Fox! Any solution?
PS: I'm making HTML template currently to turn it on WordPress Theme after finished. So no any library or framework yet.
Clip paths are still an experimental technology, syntax and behavior could change in a future update and support is not yet widespread. At this time, you should not use clip paths for any essential function of your website. It will not work correctly for a large portion of your audience (not just Firefox users, Internet Explorer doesn't support it either, and I'm not sure about Edge).
Informing visitors they need to use a different browser to use your website is not very user-friendly and will likely make them not visit your website again.
In the current release of Firefox (47), you can experiment with clip paths by going to about:config and setting the parameter 'layout.css.clip-path-shapes.enabled' to 'true'. See here for more information on this feature.
Firefox will have full support for clip paths in a future version.
Chosen Solution
To support Firefox, you can add an SVG element with the same definition to the document. Here's a demo using your polygon:
https://www.jeffersonscher.com/res/clip-path-svg.html
That's going to be tricky if you need to provide a WordPress dashboard control to allow the theme user to free-form the shape, but if you are predefining the shapes, I think it would work.
jscher2000 said
To support Firefox, you can add an SVG element with the same definition to the document. Here's a demo using your polygon: https://www.jeffersonscher.com/res/clip-path-svg.html That's going to be tricky if you need to provide a WordPress dashboard control to allow the theme user to free-form the shape, but if you are predefining the shapes, I think it would work.
Thanks a lot man I hope can figure it out well.