Tip: Move the mouse on the legend to view the vector overlay.
JavaScript source code:
<SCRIPT>
<!--
if (document.images) {
imageoff = new Image()
imageoff.src = "mtrp.gif"
image2 = new Image()
image2.src = "mtrp_contour.gif"
image3 = new Image()
image3.src = "mtrp_road.gif"
image4 = new Image()
image4.src = "mtrp_stream.gif"
image5 = new Image()
image5.src = "mtrp_urban.gif"
}
function change(picName, imgName) {
if (document.images) {
imgOn = eval(imgName + ".src")
document[picName].src = imgOn
}
}
//-->
</SCRIPT>
<body>
<div id="Layer6" style="position: absolute; left: 143px; top: 106px; width: 564px; height: 387px; z-index: 6">
<img src="mtrp.gif" NAME = "pic0" width="504" height="387" border = "0"></a></div>
<div id="Layer7" style="position: absolute; left: 46px; top: 131px; width: 67px; height: 288px; z-index: 7">
<p><a Href="contour.htm" onMouseover="change('pic0','image2')" onMouseout="change('pic0','imageoff')">
<INPUT TYPE=IMAGE ALT="Contour" width="57" height="70" src="contour.jpg"> </a>
<p><a Href="Research.htm" onMouseover="change('pic0', 'image3')" onMouseout="change('pic0','imageoff')"> <INPUT TYPE=IMAGE ALT="Roads" width="57" height="70" src="roads.jpg"> </a>
<p><A HREF="water.html" onMouseover="change('pic0', 'image4')"onMouseout="change('pic0','imageoff')"> <INPUT TYPE=IMAGE ALT="Streams" width="57" height="70" src="streams.gif"> </A>
<p> <A HREF="urban.html" onMouseover="change('pic0','image5')"onMouseout="change('pic0','imageoff')"> <INPUT TYPE=IMAGE ALT="Urban" width="57" height="70" src="urban.gif"> </A>
</div>
<div id="Layer1" style="position: absolute; left: 52; top: 517; width: 638; height: 1754; z-index: 8">
</div>
</body>
Image Source: