Looks good. I was wondering- how would I implement something like this if my web pages are based on a Dreamweaver template page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!-- TemplateBeginEditable name="doctitle" -->
<title>Quality Quest</title>
<!-- TemplateEndEditable -->
<style type="text/css">
body {
font: 14px/1.3 Arial, Helvetica, sans-serif;
color: #000000;
}
stresstext {
font: 14px/1.3 Arial, Helvetica, sans-serif;
color: #003399;
}
extract {
font: italic 14px/1.3 Arial, Helvetica, sans-serif;
color: #333333;
}
h1 {
font-size:1.3em;
font-family: Arial, Helvetica, sans-serif;
color: #333333;
}
a:link {
color:#33c;
text-decoration: underline;
}
a:visited { color:#006633}
ul li {
margin-top: 0.4em;
}
/* hide from incapable browsers */
#sizer { display:none }
.style1 {font-size: 11px}
</style>
<script src="../js/dw_cookies.js" type="text/javascript"></script>
<script src="../js/dw_sizerdx.js" type="text/javascript"></script>
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body>
<table width="935" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td height="185" colspan="3" valign="top"><img src="../logo_v2.gif" width="935" height="165" border="0" usemap="#Map">
<div id="sizer" style="position:absolute; width:164; height:29px; z-index:4; left: 278px; top: 141px;"><a href="" onclick="dw_fontSizerDX.adjust(2); return false" title="Increase font-size"
><img src="../images/plus.gif" width="20" height="20" alt="" border="0"></a>
<a href="" onclick="dw_fontSizerDX.adjust(-2); return false" title="Decrease font-size"
><img src="../images/minus.gif" width="20" height="20" alt="" border="0"></a>
<a href="" onclick="dw_fontSizerDX.reset(); return false" title="Restore default font-sizes"
><img src="../images/reset.gif" width="20" height="20" alt="" border="0"></a></div></td>
</tr>
<tr>
<td width="216" rowspan="2" valign="top"><div align="left">
<p><img src="../buttonsall.gif" width="216" height="526" border="0" usemap="#MapMap"> <br>
<map name="MapMap">
<area shape="rect" coords="28,25,190,54" href="../why_look.php" alt="Why look at quality?">
<area shape="rect" coords="29,58,190,90" href="../what_cover.php" alt="Why does quality cover?">
<area shape="rect" coords="30,92,191,124" href="../where_at.php" alt="Where are you now?">
<area shape="rect" coords="31,128,189,158" href="../what_you_want.php">
<area shape="rect" coords="31,162,189,192" href="../what_they_want.php" alt="Stakeholder needs">
<area shape="rect" coords="29,196,191,227" href="../whats_best.php">
<area shape="rect" coords="32,230,189,258" href="../what_approaches.php" alt="Choice of systems">
<area shape="rect" coords="30,260,191,293" href="../sources_of_help.php" alt="Sources of help">
<area shape="rect" coords="30,296,190,327" href="../faq_categories.php" alt="FAQ's">
<area shape="rect" coords="29,332,190,363" href="../jargon_choose_letter.php" alt="Jargon buster">
<area shape="rect" coords="31,366,189,395" href="../contact_us.php" alt="Contact us">
<area shape="rect" coords="29,398,190,428" href="../feedback.php" alt="Feedback">
<area shape="rect" coords="28,432,187,459" href="../download_categories.php" alt="Downloads">
<area shape="rect" coords="30,467,191,496" href="http://qualityquest.blogspot.com" alt="News & chat">
</map>
<span class="style1"><a id="dw_link" href="http://www.dyn-web.com">dyn-web.com</a>
<script src="../js/sizer_inf.js" type="text/javascript"></script>
</span>
<!-- end required link components -->
<a href="../disclaimer.php" class="style1">disclaimer</a> </p>
<p>i</p>
</div></td>
<td width="20" height="149"> </td>
<td valign="top"><!-- TemplateBeginEditable name="EditRegion1" -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="699" height="136"> </td>
</tr>
</table>
<!-- TemplateEndEditable --></td>
</tr>
<tr>
<td height="452"> </td>
<td width="699"> </td>
</tr>
</table>
<div align="left"><map name="Map">
<area shape="rect" coords="20,127,118,152" href="../index.php">
<area shape="rect" coords="440,123,598,154" href="../site_map.php">
<area shape="rect" coords="634,125,748,153" href="../search.php">
</map>
<!-- link for free use -->
<script type="text/javascript">
/*************************************************************************
This code is from Dynamic Web Coding at dyn-web.com
Copyright 2004-5 by Sharon Paine
See Terms of Use at www.dyn-web.com/bus/terms.html
regarding conditions under which you may use this code.
This notice must be retained in the code as is!
*************************************************************************/
// setDefaults arguments: size unit, default size, minimum, maximum
// optional array of elements or selectors to apply these defaults to
//dw_fontSizerDX.setDefaults("px", 14, 9, 32, ['div#content'] );
// set arguments: default size, minimum, maximum
// array of elements or selectors to apply these settings to
//dw_fontSizerDX.set(12, 9, 18, ['div.sidebar'] );
dw_fontSizerDX.init();
</script>
<script type="text/javascript">
Element.cleanWhitespace('content');
init();
</script>
</div>
</body>
</html>