The Clicker

Description: The clicker is a graphic "channel changer" to provide quick navagation tools in a popup window.

Demo:

Clicker

If you like Clicker, please rate it! @ ScriptSearch.com - Select - Excellent! Very Good Good Fair Poor Go to ScriptSearch.com

Download all files

Instructions:

1. Insert the following script into the document header:
   

   <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
   document.write('<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">')
   document.write('function openWindow() {<BR>')
   document.write ('window.open("","clickIt","toolbar=0,location=0, scrollbars=auto,width=220,height=350,resizable=1")')
   document.write ('}')
   document.write('</SCRIPT>')
   </SCRIPT>
   			

2. Insert the following script into the document body:
   

   <A HREF="../images/clicker/clicker.html" onClick=openWindow() Target="clickIt">
   <IMG SRC="../images/clicker/clickerIcon.gif" WIDTH=32 HEIGHT=50 ALT="" BORDER="0"><BR>
   Clicker</A>
   		

3. Generate 9 40x40 pixel (or smaller) images to use for the clicker buttons.
4. Modify the file clicker.html. Lines 29 through 83 are the links, all of which are set up as follows:
   

   	<TD onMouseOver="this.className='on'" onMouseOut="this.className='off'">
   	<A HREF="JavaScript:self.close()">
   	<IMG SRC="IMAGEFILE.gif" WIDTH="40" HEIGHT="40" ALT="HOVER TEXT" BORDER="0" TITLE="HOVER TEXT"
   	onMouseOver="nav.innerHTML='PANEL TEXT'"></A></TD>
   	

   Replace IMAGEFILE.gif with the name of the image for the button. Replace HOVER TEXT with the string that should be shown on mouse hover. Replace PANEL TEXT with the string that you want to display in the display window at the top of the clicker.