JavaScript on GooglePages
This GooglePage demonstrates two simple examples of JavaScript content: a browser detection script and an active image map/caption. Several intersting examples of JS on GooglePages created using GPC can also be found among the GPC Test Results
.
Note: the detailed List of Known GPC Bugs
is a must-read before attempting any serious experimentation with JS on GooglePages.
Browser Detection
This sample script detects the name and version of the browser viewing the page.
Active Image Map/Caption
Caption text responds to mouse movements over the image map.
Active caption text:
JavaScript Code Used in the Examples
Browser detection
<div>
<script type="text/javascript">
var browser=navigator.appName
var b_version=navigator.appVersion
var version=parseFloat(b_version)
document.write("Browser name: "+ browser)
document.write("<br />")
document.write("Browser version: "+ version)
</script>
</div>
Active Image Map/Caption
<div>
<script type="text/javascript">
function writeText(txt) { document.getElementById("caption").innerHTML=txt }
</script>
</div>
<p style="margin-top: 1em;">
Active caption text:
<span id="caption" style="font-weight: bold;"></span>
</p>
<img src="4colors.gif" style="border: medium none ; margin: 1em 2em; width: 290px; height: 290px;" alt="4 colors" usemap="#colormap">
<map id="colormap" name="colormap">
<area shape="rect" coords="0,0,145,145" onmouseover="writeText('red square')" href="#" target="_blank" title="red">
<area shape="rect" coords="145,0,290,145" onmouseover="writeText('green square')" href="#" target="_blank" title="green">
<area shape="rect" coords="0,145,145,290" onmouseover="writeText('yellow square')" href="#" target="_blank" title="yellow">
<area shape="rect" coords="145,145,290,290" onmouseover="writeText('blue square')" href="#" target="_blank" title="blue">
</map>
