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.


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

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

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.


function switchimage (id, color) {
      d = document.getElementById(id);
      d.src = color;

a {
      text-decoration: none;

<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>
Hi joedunn,

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


Here's an example:

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.