<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
http://www.w3.org/TR/html4/strict.dtd">
<html dir="ltr" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>CSS Resolution Demo using document.write</title>
<link rel="stylesheet" href="basic.css" type="text/css" />
<!--
Extra style (applied via JavaScript) to override default settings
according to the screen resolution
-->
<script type="text/javascript">
var cssName;
var resolutionInfo;
if(screen.availWidth < 650) {
cssName = 'lowres.css';
resolutionInfo = 'low resolution';
}
else {
if (screen.availWidth > 1000) {
cssName = 'highres.css';
resolutionInfo = 'high resolution';
}
else {
cssName = 'mediumres.css';
resolutionInfo = 'medium resolution';
}
}
document.write( '<link rel="stylesheet" href="' +
cssName + '" type="text/css" />');
</script>
</head>
<div id="content">
<script type="text/javascript">
document.write( '<p>Applied Style: ' +
resolutionInfo + '</p>');
</script>
<p>The write() function of the document object allows us to insert
HTML into the page, and is useful for debugging (displaying values of
variables for instance). However document.write adds a string to the
document and must therefore be placed within the HTML file.</p>
</body>
</div>