Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

How to show an error to firefox users when loading my site?

more options

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.

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 <!--[if lt IE 9 ]> <div class="ink-alert basic" role="alert"> <button class="ink-dismiss">&times;</button> <p> <strong>You are using an outdated Internet Explorer version.</strong> Please <a href="http://browsehappy.com/">upgrade to a modern browser</a> to improve your web experience. </p> </div> <![endif]--> But for Firefox users to lead them is the best experience if they open the website by another browser like chrome or etc.
Attached screenshots

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 👍 0

All Replies (8)

more options
more options

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.

more options

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.

more options

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?

more options

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.

more options

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.

more options

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.

more options

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.