PDA

View Full Version : noscript + html comments



traq
06-16-2010, 07:29 PM
hi all,

I've been experimenting more lately with javascript. Because of my current clientele (corporate - read: old computers/browsers), I'm trying to keep everything as degrade-able as possible.

In some cases, I need to hide stuff when there's no javascript - essentially, items that won't be used (and would be in the way) if javascript isn't on.

I've been using noscript tags to hold html comments, like so:


<noscript> <!-- </noscript>
<div>This div should be hidden if javascript is disabled, but visible if javascript is on.</div>
<noscript> --> </noscript>

I thought that was "the" solution, but I've come across situations where it doesn't seem to work. In Chrome, for example, the comment tag actually comments out the closing noscript tag, making the div inside always hidden.

Any solutions?

In this particular example, the div is an overlay that hides the entire page and then fades out - basically a flash-style intro.

My alternative is to have the div hidden when the page loads and show it via javascipt, but I don't want to risk seeing the content that's supposed to be hidden while waiting for the javascript to run on an older machine.

Thanks, everyone.

jscheuer1
06-17-2010, 04:04 AM
What I do is use style. Say your div has an id - "overlay":


<style type="text/css">
#overlay {
display: none;
}
</style>

Then one of the first things in your script could be:


document.write('<style type="text/css">#overlay {display: block;}<\/style>');

As long as the script follows the style and both are in the head, it will produce valid code. If javascript is enabled, the scripted style will override the hard coded one and the overlay will be seen. If javascript is unavailable, the hard coded one is the only one the browser will see, so the overlay will not be shown.

Many people prefer to use the onload or document ready event to reveal javascript only elements like this. However, that often takes too long. Doing it this way is just like having it hard coded, no waiting for the page to load.

traq
06-17-2010, 05:14 AM
Never heard that before. Thanks!