|
↑
Page Details >>>
This neat little JavaScript will indicate which link is selected with a little arrow image. Hard to explain, but you'll understand when you see it!
Step 1: Add the below code to the <body> section of your page:
<script
language="javascript"
type="text/javascript">
function
imgover(imgname){
imgname.src
=
"arrow.gif"
}
function
imgout(imgname){
imgname.src
=
"blank.gif"
}
</script>
<center>
<table
border=0>
<tr><td>
<img
name="pic1"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://altavista.digital.com"
onMouseOver="imgover(pic1)"
onMouseOut="imgout(pic1)">Altavista</A>
<br>
<img
name="pic2"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.excite.com"
onMouseOver="imgover(pic2)"
onMouseOut="imgout(pic2)">Excite</A>
<br>
<img
name="pic3"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.hotbot.com"
onMouseOver="imgover(pic3)"
onMouseOut="imgout(pic3)">Hotbot</A>
<br>
<img
name="pic4"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.infoseek.com"
onMouseOver="imgover(pic4)"
onMouseOut="imgout(pic4)">Infoseek</A>
<br>
<img
name="pic5"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.lycos.com"
onMouseOver="imgover(pic5)"
onMouseOut="imgout(pic5)">Lycos</A>
<br>
<img
name="pic6"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.magellan.com"
onMouseOver="imgover(pic6)"
onMouseOut="imgout(pic6)">Magellan</A>
<br>
<img
name="pic7"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.webcrawler.com"
onMouseOver="imgover(pic7)"
onMouseOut="imgout(pic7)">Webcrawler</A>
<br>
<img
name="pic8"
SRC="blank.gif"
width=10
height=10
border=0>
<A
HREF="http://www.yahoo.com"
onMouseOver="imgover(pic8)"
onMouseOut="imgout(pic8)">Yahoo!</A>
</td></tr></table>
</center>
|
Step 2: The script uses 2 images as part of its interface. You can create your own, or use the 2 below (resized for easier download):
(right click images, and select "Save Image As")
Upload them into the same directory as your webpage.
→
|