Is Javascript On or Off?
Turns out there's a more straightforward way to do what I wanted, with no need for style sheets or putting scripts in the
<head> or ...
<script language="JavaScript" type="text/javascript"><!--
document.writeln('JavaScript is ON');
// --></script>
<noscript>JavaScript is OFF</noscript>
(thanks to Matt W.)
(Follow the comment link to read about the overly-complicated stylesheet-manipulating JavaScript I threw together the other day to do the same thing in a worse way...)
I made a low-tech but useful JavaScript for myself the other day. On the
page my browser opens to first, I wanted a way to immediately
see if JavaScript is on without going into IE's (or Opera's) menus or preferences to check. I know of no browser (except possibly some branch of Mozilla I haven't seen) which has a status indicator specifically for that piece of information. So I made one.
One caveat -- it only works if you have style sheets enabled. (But it seems most folks do.)
The result looks like this:
[disabled because I kept getting some weird errors from it] JavaScript is ON OFF
(Turn on or off JavaScript and reload to see the difference.)
So far I've seen it work in IE6/Windows, Opera 6/Windows, Mozilla 6/Mac and IE 5.1/MacOSX, so there's a decent chance it'll work in plenty of other browsers. 'Working' is defined as showing the red 'ON' when you load the page with JavaScript turned on.
Anyone not interested in the code can stop reading now...
This goes between your page's
<head> tags (or put just the function in an external script, like I did for this very page):
<script language="JavaScript" type="text/javascript"><!--
function jstest() {
document.getElementById('jon').style['background'] = 'red';
document.getElementById('joff').style['background'] = 'white';
}
//--></script>
In your opening
<body> tag, add an '
onload' entry like so:
<body onload="jstest()" bgcolor="white" text="black" [etc...]>
Then somewhere in your main page body, put something like this:
<small>JavaScript is <b><span id="jon" style="color: white; background: white;"> ON </span><span id="joff" style="color: white; background: green;"> OFF </span></b></small>
You can change the code to display what you like; it's all text and colors, no graphics. Just keep track of the names of your
id tags in the
<span>s, making sure they match the values in the script. Also, make sure that the colors for 'invisible' pieces match the background of the page (in this case, white). You can obviously play with these values (maybe you want OFF to be red and ON to be green...).
3 comment(s)
The following works without CSS support (ie: even earlier browsers). Just stick it in the body of the document...
JavaScript is OFF
Throw in tags in the writeln/noscript sections if you want it to look prettier.
Re: the mozilla note... with any mozilla, head over to
http://xulplanet.com/downloads/view.cgi?category=applications&view=prefbar
to get a toolbar that shows and lets you control your javascript enabled/disabled setting (and a couple others). Bummer is that when you upgrade Mozilla, you have to go back to xulplanet to re-install the toolbar.
OK, so it was pretty much just an exercise for which there was a better solution sitting out there.
Still, I learned stuff doing it.
...and I learned something from your having done it too. I've yet to fiddle with any of that DOM stuff. Looks like you can do some neat stuff with it. :)
Add a comment...
Wednesday, 20 February 2002
