|
|
HTML Tips and Tricks
by Scott Clark The Client Is Always Right!
Part 2 Now you can use the browser information to display browser/version specific tags, such as marquee or table background color tags: <BODY>
<SCRIPT LANGUAGE = "JavaScript"> if (version == 3) document.write("<CENTER> <TABLE BORDER=2 ><TD BGCOLOR=\"pink\"> <CENTER> <H3>You're using the latest, greatest Web browser, Netscape Navigator 3.0!</H3> </CENTER></TABLE></CENTER>"); else if (version == 2) document.write("<CENTER> <TABLE BORDER=2gt;<TD BGCOLOR=\"pink\"> <CENTER> <H3>You're not using the latest version, but hey, at least you've got Netscape Navigator 2.x.</H3> </CENTER></TABLE></CENTER>"); else if (version == 1) document.write("<CENTER> <TABLE BORDER=2 CELLPADDING=4> <TD BGCOLOR=\"pink\"> <CENTER> <MARQUEE>You're using Microsoft Internet Explorer</MARQUEE> </CENTER></TABLE></CENTER>"); else document.write("<H2 ALIGN=\"center\">You're using a JavaScript capable browser that I'm not aware of!! </H2>"); </SCRIPT> </BODY > What the JavaScript does is to use the userAgent variable to find out the browser and version that the client is using: var version = 0; if (navigator.userAgent.indexOf("Mozilla/3.0") != -1) version = 3; else if (navigator.userAgent.indexOf("MSIE") != -1) version = 1; else if (navigator.userAgent.indexOf("Mozilla/2.0") != -1) version = 2; else version = 0; Then it assigns each browser/version a number, and tells the client to send specific HTML to the client for each specific browser: if (version == 3) document.write("<CENTER> <TABLE BORDER=2><TD BGCOLOR=\"pink\"> <CENTER> <H3>You're using the latest, greatest Web browser, Netscape Navigator 3.0! </H3> </CENTER></TABLE></CENTER>"); etc... (it continues testing until conditions are met). This way, the same page can be sent to all clients, and the client's browser will show the appropriate page accordingly. If the browser is JavaScript-challenged, then the JavaScript will be ignored, and the normal HTML tags will be seen. If, however, you put in both standard HTML tags, as well as JavaScript, you may end up with them both being displayed in the JavaScript-capable browser (unless you use if-then statements in your JavaScript code--but that's another article). One way to create a page that can be correctly read by JavaScript-challenged browsers and still display the appropriate cutting-edge tags for newer versions is to make the page the only frame in a framed page. The FRAMESET would look something like this: <FRAMESET ROWS="100%,*"> <FRAME SRC="oneframe.html" NAME="only" NORESIZE> </FRAMESET> The ROWS (or COLS) are set so that the only frame in the set is displayed 100%. The frame should not be re-sizable, hence the NORESIZE tag. You have to make sure that all links on the framed page use the TARGET = "_self" property so that the whole framed page is replaced when the link is clicked on. You can then place a page with the standard HTML tags (for JavaScript-challenged browsers) inside the NOFRAMES tags. [ Click here to move to the last part of the article ]
Web Developer® Site Feedback
Web Developer®
Copyright © 2000 internet.com Corporation. All rights reserved.
|
|
