Mini-JavaScripts

These are small JavaScript projects that can come in handy.

Choosing the listed item will take you to that particular page. The JavaScript uses the DOM of a form object and appends the target page URL to a base URL. This is a nice technique if you have lots of links, by keeping them "above the fold".

The value of a link or a field can be passed to another page by appending the value to the URL of the page you are going to. The JavaScript in the target page parses through the URL and stores the value you are passing, which is behind the "#" sign, and writes it to the target page as you designate. In this case I am writing the value to a field in a form.

If you like to use rollover images for your buttons and want the button to reflect the page you are on AND be able to use a server-side include for the buttons? Then this script will work for you.

The buttons

These buttons highlight on mouse over.
Click a button to go to a page and see the individual page recognition

Pretend you are on the "Who We Are" page

Want to know how it is done? Here is the link to the code for the Button Rollovers with Individual Page Recognition.

There is no easy way to truncate a number to a specified number of decimal places in JavaScript until ECMA Standard 3 which is only supported by the newest browsers. There now is a simple method called toFixed() and you enter the number of decimal places you want inside the parenthesis, as such toFixed(2) gives you two decimal places.

Modern Browser Sniffing

The old fashion way to browser sniff is to test for the browser version using the Navigator objects, such as:

theBrowserVersion = parseInt(navigator.appVersion);
	if (theBrowserVersion < 4) {
		do the really old browser code;
	}

Or maybe you check for the browser vendor using something like:

	if (navigator.appName.indexOf("Netscape") != -1) {
		theBrowserVendor = NS;
		}
		else if (navigator.appName.indexOf("Microsoft") != -1) {
			theBrowserVendor = IE;
		}
	
	if (theBrowserVendor == NS) {
		do the NS code;
		}
		else if (theBrowserVendor == IE) {
			do the IE code;
		}

The problem with testing for vendor and version, using the Navigator object, is that you have to keep updating all your pages as versions are upgraded and new vendors enter the market. What you need to use is Document object testing.

Document Object Testing

1. The versions of Microsoft Internet Explorer (IE4 - IE 6) use the non-W3C supported object document.all.
2. The versions of Netscape (NS4 - NS 6) support the non-W3C object document.layers.
3. The most current version of Netscape, NS6, supports the W3C objects document.implementation && document.implementation.hasFeature('HTML','1.0').
4. Opera does not seem to support the W3C object docment.implementation, nor document.all nor documemnt.layers, but they say they are currently working on the DOM 2.0 standard.

So what does this all mean? Because browser vendors are moving to be standards compliant by supporting the W3C Document Object Model (DOM), your best bet for browser sniffing is to use Document object sniffing as such:

var ns4 = (document.layers)? true:false;
var ie4 = (document.all)? true:false;
var DOM = (document.implementation && document.implementation.hasFeature('HTML','1.0'))
? true:false;
	if (ns4) {
		do the document.layer code;
		}
		else if (ie4) {
			do the document.all code;
			}
			else {
				do the DOM thing;
				//comment: have everything besides the older NS and IE
				 browsers fall into the DOM code then you will pick up
				 Opera.
				}

Now your code does not need to be updated for every version upgrade or new vendor. Check it out, my Mainz Press, LLC homepage uses this browser sniffing. Of course, that also means you have to write the JavaScript so that it supports these different Document objects.

One way to acheive the same effect as document.layers and document.all is to use the W3C DOM supported method document.getElementById("idName").