Text Link Rollover - Switch Bullet Color

I would like to figure out how to rollover a text link and change a red bullet graphic to a blue one.

Example:

TEST Link  * <- (Imagine * is a Red Bullet)


When you mouse over TEST Link the * changes to the blue version of the graphic.

Thanks
joedunnAsked:
Who is Participating?
 
radnorConnect With a Mentor Commented:
I did this real quick....   I have 2 GIF(s) 1 red, 1 blue BOTH 10px X 10px.  If you have more than one link, give each one a UNIQUE ID and make that ID apart of the onMouse event.

<html>
<head>
<title>test</title>

<script>
function switchimage (id, color) {
      d = document.getElementById(id);
      d.src = color;
}
</script>

<style>
a {
      text-decoration: none;
}
</style>

</head>
<body>
<a href="#" onMouseOver="javascript:switchimage('link', 'blue.gif')"
 onMouseOut="javascript:switchimage('link', 'red.gif')">TEXT link <img src="red.gif" id="link" border=0></a>
</body>
</html>
0
 
DaydreamsCommented:
Hi joedunn,

You can use CSS to change the image for your list bullet. Take a look at this simple tutorial with code:

http://www.joe2torials.com/view_tutorial.php?view=43

Here's an example:

http://www.joe2torials.com/css/examples/rollover/index.php
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.