Picture Navigator
copy-paste
<!-- TWO STEPS TO INSTALL THUMBNAIL NAVIGATOR: 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <head> <script language="JavaScript"> <!-- Original: Daniel Smith (xalres@earthlink.net) --> <!-- Web Site: http://home.earthlink.net/~xalres --> <!-- Begin prev1 = new Image (32,18); prev1.src = "prev1.jpg"; prev2 = new Image (32,18); prev2.src = "prev2.jpg"; next1 = new Image (32,18); next1.src = "next1.jpg"; next2 = new Image (32,18); next2.src = "next2.jpg"; go1 = new Image (48,24); go1.src = "go1.jpg"; go2 = new Image (48,24); go2.src = "go2.jpg"; maxPic = 5; p1 = new Image (144,96); p1.src = "1-thumb.jpg"; link1 = "1-full.jpg"; p2 = new Image (144,96); p2.src = "2-thumb.jpg"; link2 = "2-full.jpg"; p3 = new Image (144,96); p3.src = "3-thumb.jpg"; link3 = "3-full.jpg"; p4 = new Image (144,96); p4.src = "4-thumb.jpg"; link4 = "4-full.jpg"; p5 = new Image (144,96); p5.src = "5-thumb.jpg"; link5 = "5-full.jpg"; count = 1; function next() { count++; if (count > maxPic) { count = 1; } eval("document.p.src=p" + count + ".src"); } function back() { count--; if (count == 0) { count = maxPic; } eval("document.p.src=p" + count + ".src"); } function link() { location.href=eval("link" + count); } // End --> </script> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <center> <table bgcolor="#003366" border=0> <tr> <td align=center width=300> <font color=white face="Arial, Helvetica" size="+1">Thumbnail Navigator</font> <br><br> <img name=p src="../../../../1-thumb.jpg" border=0 width=144 height=96> <br> <table border=0> <tr> <td><a href="javascript:back()" onMouseOver="prev.src=prev2.src" onMouseOut="prev.src=prev1.src"><img src="../../../../prev1.jpg" width="32" height="18" border="0" name="prev"></td> <td></a><a href="javascript:link()" onMouseOver="go.src=go2.src" onMouseOut="go.src=go1.src"><img src="../../../../go1.jpg" width="48" height="24" border="0" name="go"></td> <td></a><a href="javascript:next()" onMouseOver="next.src=next2.src" onMouseOut="next.src=next1.src"><img src="../../../../next1.jpg" width="32" height="18" border="0" name="next"></td> </tr> </table> <br> <font color="#A3ACC9" size="2" face="Arial"> Browse to a picture you like and click "GO".</font> </td> </tr> </table> </a></center>
