I have a script for writing multiple image rollovers in an external javascript file.

The javascript file looks like this:

// JavaScript Document
window.onload = rolloverInit;

function rolloverInit() {
for (var i=0; i<document.images.length; i++) {
if (document.images[i].parentNode.tagName == "A") {

function setupRollover(thisImage) {
thisImage.outImage = new Image();
thisImage.outImage.src = thisImage.src;
thisImage.onmouseout = rollOut;

thisImage.overImage = new Image();
thisImage.overImage.src = "images/gfx/rollOvers/" + thisImage.id + "_on.png";
thisImage.onmouseover = rollOver;

function rollOut() {
this.src = this.outImage.src;

function rollOver() {
this.src = this.overImage.src;

An example of the the html looks like this:

<div class="place_arrowNext">
<a href="gg_foliage_service_testimonials2.html"><img src="images/gfx/rollOvers/testimonialNext_off.png" width="190" height="50" border="0" alt="Read Next Testimonial" id="testimonialNext" /></a></div>

The class, "place_arrowNext" is only used for positioning the arrow on the document. The id, "testimonialNext" is what connects the image to the external javascript file. All of this is online and can be found at: http://gginteriors.com/gg_foliage_se...timonials.html

The problem I'm having, is that on my browser (the latest version of Firefox), the images with a parent node of "A" that aren't meant to be rollovers flash when you roll over them. They flash between the original image and the alt tag, like the browser thinks they are rollovers. The G&amp;G Interiors logo for example in the upper left corner of the document is an image with a link that is NOT a rollover.

How do I specify which images are supposed to be rollovers and which ones aren't?

Thank you, thank you, thank you!