This JavaScript displays a small arrow before the link which you have your
mouse over. This script is great for web designers who have little JavaScript experience.
Mouse over to view
Put this code into your page:
<html>
<head>
<title>WebDesignHelper.co.uk - Sample Code 4</title>
<style>
.text
{
FONT: 10pt arial;
COLOR: black
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
image01 = "images/on.gif" //image when mouse is over the link
image02 = "images/off.gif" //image when mouse isn't over the
link
function imgover(imgname){
imgname.src = image01
}
function imgout(imgname){
imgname.src = image02
}
//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<center>
<TABLE width="150" border="0" cellpadding="0" cellspacing="0" bgcolor=#F5F4E0>
<tr>
<td colspan=4><img src=images/spacer.gif height=10></td>
</tr>
<tr>
<td><img src=images/spacer.gif width=10></td>
<td width=20 bgcolor=white><IMG NAME="image01" SRC="images/off.gif" WIDTH=10
HEIGHT=10 BORDER=0></td>
<td width=150 bgcolor=white><A HREF="sample_code_example4.html" onmouseover="imgover(image01)" onmouseout="imgout(image01)"><font
class=text>Example Link 1</font></a></td>
<td><img src=images/spacer.gif width=10></td>
</tr>
<tr>
<td><img src=images/spacer.gif width=10></td>
<td width=20 bgcolor=white><IMG NAME="image02" SRC="images/off.gif" WIDTH=10
HEIGHT=10 BORDER=0></td>
<td width=150 bgcolor=white><A HREF="sample_code_example4.html" onmouseover="imgover(image02)" onmouseout="imgout(image02)"><font
class=text>Example Link 2</font></a></td>
<td><img src=images/spacer.gif width=10></td>
</tr>
<tr>
<td colspan=4><img src=images/spacer.gif height=10></td>
</tr>
</table>
</center>
</body>
</html>
|
More Web Programming: 
