Hiding a Class if JavaScript is Disabled

December 8th, 2007 by tbaumgard

Basically needed to be able to display a message if JavaScript was disabled, or just not available. Just give the classname “_JscptHide” to whatever needs to be hidden if JavaScript is enabled. Here’s the code:

JscptHide.js:

// Append style to created div (works in IE, Firefox)
var _JscptHide = document.createElement("div");
_JscptHide.innerHTML = "<style type='text/css'>._JscptHide{display:none;}</style>";
document.body.appendChild(_JscptHide);

// Append style element to the head (works in Safari, Firefox)
_JscptHide = document.createElement("style");
var _JscptHide_Style = document.createTextNode("._JscptHide{display:none;}");
_JscptHide.type = "text/css";
_JscptHide.appendChild(_JscptHide_Style);
document.getElementsByTagName("head")[0].appendChild(_JscptHide);

The two blocks of code were needed for cross-browser support.
The following site was inspiration for the first portion, I thought up the second part:

Geek Daily Blog

Leave a Reply