Geek Answers Handbook

Hide html element with javascript only if Firefox browser

How to hide div with javascript if browser only firefox?

+7
javascript html firefox
source share
6 answers

To check the Firefox browser

//Javascript var FIREFOX = /Firefox/i.test(navigator.userAgent); if (FIREFOX) { document.getElementById("divId").style.display="none"; } <!-- HTML--> <div id="divId" />
+8
source share

Just check the FF-specific JavaScript property. For example.

 var FF = (document.getBoxObjectFor != null || window.mozInnerScreenX != null); if (FF) { document.getElementById("divId").style.display = 'none'; }

This is called feature detection , which is preferred over user discovery. Even the jQuery $.browser API (of which you would use if ($.browser.mozilla) for) recommends avoiding user agent detection.

+7
source share

Is Firefox a browser is almost always the wrong question. Of course, you can start to crawl through the User-Agent , but it is so often misleading that it should not be touched, except as a last resort.

This is also a wavy question, since there are many browsers that are not Firefox, but are based on the same code, so they are almost the same. Is it SeaMonkey Firefox? Is it Flock Firefox? Is Fennec Firefox? Is it Iceweasel Firefox? Is Firebird (or Phoenix!) Firefox? Is Minefield Firefox?

The best route is to pinpoint why you want to relate to Firefox differently and to think about this thing. For example, if you want to get around the error in Gecko, you can try to cause this error and find the wrong answer from the script.

If this is not possible for any reason, a common way to sniff out the Gecko renderer is to check for the Mozilla property. For example:

 if ('MozBinding' in document.body.style) { document.getElementById('hellononfirefoxers').style.display= 'none'; }

edit: if you need to run the test in <head> , before the body or target div is in the document, you can do something like:

 <style type="text/css"> html.firefox #somediv { display: none } </style> <script type="text/javascript"> if ('MozBinding' in document.documentElement.style) { document.documentElement.className= 'firefox'; } </script>
+2
source share
  if(document.body.style.MozTransform!=undefined) //firefox only
+2
source share
 function detectBrowser(){ .... } hDiv = .... //getElementById or etc.. if (detectBrowser() === "firefox"){ hDiv.style.display = "none" }
+1
source share

You can try the Rafeal Lima Browser Selector CSS script. It adds several classes to the HTML element for OS, browser, js support, etc. You can then use these classes as hooks for further CSS and / or JS. You can write a CSS selector (or jQuery) like html.gecko div.hide-firefox after running the script.

0
source share

More articles:


All Articles