Source of dual.htm
<![CDATA[<html><head>
<Title>JavaScript Resources - Dual-purpose pages</title>
<script language="JavaScript">
<!--
var RunningIE4
RunningIE4 = (msieversion() >=4);
function msieversion() {
var ua = window.navigator.userAgent
var msie = ua.indexOf ( "MSIE " )
if ( msie > 0 ) // is Microsoft Internet Explorer; return version number
return parseInt ( ua.substring ( msie+5, ua.indexOf ( ".", msie ) ) )
else
return 0 // is other browser
}
function tick() {
// This function is a cut-down version of the one in Microsoft's Internet Client SDK
// It updates the contents of a DIV (called 'Clock') with the current time.
// It only works with Internet Explorer 4 or later.
// This function is only executed (i.e. called from startClock()) if you're running IE4.
// The reference to Clock.innerHTML would be invalid in non-IE4 browsers (e.g. Navigator),
// but as long as you don't actually execute the code, those browsers won't generate
// an error. This allows you to put IE-specific code in your page, protect it with
// an 'if (RunninIE4 == true)' test, and run the page on both types of browser.
var hours, minutes, seconds;
var intHours, intMinutes, intSeconds;
var today;
today = new Date();
intHours = today.getHours();
intMinutes = today.getMinutes();
intSeconds = today.getSeconds();
hours = intHours + ":";
if (intMinutes < 10) {
minutes = "0"+intMinutes+":";
} else {
minutes = intMinutes+":";
}
if (intSeconds < 10) {
seconds = "0"+intSeconds+" ";
} else {
seconds = intSeconds+" ";
}
timeString = hours+minutes+seconds;
Clock.innerHTML = timeString;
}
function startUp () {
// This function is called unconditionally from the BODY section's onLoad event
// It decides whether to do an IE4 or non-IE4 process
if (RunningIE4 == true) {
startClock()
} else {
// put any code for non-IE4 browsers in here
}
}
function startClock() {
// This function is only executed (from startUp()) if you're running IE4
tick();
window.setInterval("tick();", 1000);
}
//-->
</script>
</head>
<body onLoad="startUp();" bgcolor="#ffe4c4" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<table align="center" cellspacing="2" cellpadding="2">
<tr>
<td align="center"><a href="contents.htm"><img src="contents.gif" width=107 height=21 border=0 alt="Contents"></a></td>
<td align="center"><a href="index3.htm"><img src="homepage.gif" width=107 height=21 alt="Home Page" border=0></a></td>
<td align="center"><a href="checkie4.htm"><img src="mail.gif" width=107 height=21 border=0 alt="Email"></a></td>
</tr>
</table>
<center><h1>Dual-purpose pages that work in IE4 and other browsers</h1></center>
<!--
The next element is the DIV which is updated by the IE4-only JavaScript clock routine tick()
The default content of the DIV is a JavaScript routine which generates an image tag and some text, but only if the browser isn't IE4. This content will be overwritten by the clock output if the browser is IE4.
-->
<div id=Clock>
<script language="JavaScript">
// This routine generates the default content for this DIV, which is displayed if the browser
// *isn't* IE4.
// I've done it this way, using a conditional document.write() method call rather than simply
// hard-coding the content into the page source, because otherwise the default content
// appears on screen even on IE4, in the time before the document has finished downloading
// from the server.
if (RunningIE4 == false) {
document.write("<p><img src=\"MSClock.gif\" align=\"left\" width=101 height=104 border=0 alt=\"Clock\">This is where an active clock would be if you were running IE 4. Never mind though, here's a picture of a clock, courtesy of Microsoft's Clip Art library, instead.</p>")
}
</script>
</div>
<p>This page works in any JavaScript-enabled browser. If you're using Internet Explorer 4.0 or later, you'll see a digital clock ticking away above this text. If you're using any other browser, you'll see a static image and some text instead. The page decides for itself whether to execute the IE4-specific JavaScript code which displays and updates the clock, so you don't need to protect it behind a switching page (see previous example).</p>
<p>Since this script uses document.write to add the clock graphic, if you view the source in a a browser other than IE 4.x, you won't get the correct script. If you are viewing this page in another browser, click here to see the source.</p>
<p>Programming all your pages to be dual-format like this is a complex business, and probably not worth the effort - and anyway, pages authored from the ground up to make use of Dynamic HTML aren't likely to make much sense without the DHTML features. If you want to offer a lot of dual-format content on your site, then you're probably better off authoring two complete sets of pages and protecting the IE4-specific ones with a switching routine like the previous example.</p>
<p>However, this technique is a handy way to add the odd IE-specific tweak to your existing pages while still remaining compatible with other browsers.</p><hr><center><font size="-1"><script language="JavaScript">
<!-- // new options introduced by Bernhard Friedrich; should work in all browsers
// additional code to display date in Month Day, Year format by Robert Crooks
var lutext;
var lutime;
var ludm;
var ludd;
var ludy;
function sstr(a,b){ //extract substrings
ret=lutime.substring(a,b);
if (ret=="Jan" || ret=="01") ret="1";
if (ret=="Feb" || ret=="02") ret="2";
if (ret=="Mar" || ret=="03" || ret=="Mrz") ret="3";
if (ret=="Apr" || ret=="04") ret="4";
if (ret=="May" || ret=="05" || ret=="Mai") ret="5";
if (ret=="Jun" || ret=="06") ret="6";
if (ret=="Jul" || ret=="07") ret="7";
if (ret=="Aug" || ret=="08") ret="8";
if (ret=="Sep" || ret=="09") ret="9";
if (ret=="Oct" || ret=="Okt") ret="10";
if (ret=="Nov") ret="11";
if (ret=="Dec" || ret=="Dez") ret="12";
return ret;
}
lutime = unescape(document.lastModified);
if (lutime.length == 17) { // Netscape 3 and higher, Internet Explorer 4
ludm = sstr(0,2);
ludd = sstr(3,5);
ludy = sstr(6,8);
}
if (lutime.length == 19) { // Netscape 3 and higher, Internet Explorer 4 and higher, 4-digit year
ludm = sstr(0,2);
ludd = sstr(3,5);
ludy = sstr(6,10);
}
if (lutime.length == 25 || lutime.length == 24) { // Netscape 2
ludm = sstr(4,7);
ludd = sstr(8,10);
ludy = sstr(20,24);
}
if (lutime.length == 29) { // Opera 3
ludm = sstr(8,11);
ludd = sstr(5,7);
ludy = sstr(12,16);
}
if (lutime.length == 23) { // Internet Explorer 3
ludm = sstr(3,6);
ludd = sstr(7,9);
ludy = sstr(19,23);
}
lutext = "";
monthName = new Array(12)
monthName[1] = 'January'
monthName[2] = 'February'
monthName[3] = 'March'
monthName[4] = 'April'
monthName[5] = 'May'
monthName[6] = 'June'
monthName[7] = 'July'
monthName[8] = 'August'
monthName[9] = 'September'
monthName[10] = 'October'
monthName[11] = 'November'
monthName[12] = 'December'
yearNow = null
if (ludy.length==2) {
if (ludy >= 90) {
yearNow = 19
}
else {
yearNow = 20
}
}
else yearNow=""
lutext += ludd+" "+ monthName[ludm] +" "+ yearNow + ludy +" ";
document.write("Page last modified " + lutext);
// -->
</script></font></center><hr>
</body>
</html>
]]>
