Multiple Rollovers

[dancingeyes]

I stumbled upon a javascript rollover function which apparently originated from Dynamic Drive, and I am looking for help in modifying it to add another function. Since I don't know how to write script, I'd appreciate any tips/pointers.
The page in question is found at:
http://dancingeyes.com/betsy/gallery.html

As you'll see, when the mouse rolls over any given thumbnail, the corresponding enlargement appears to the right. What I'd like to be able to do is—upon mouse over—have the thumbnail itself also replaced by another thumbnail variation (i.e. another jpg, in its place), as well as the enlargement to the right. I know how to do this using Dreamweaver, but the problem (and this is crucial!) is that unless the thumbnails are completely adjacent (which is not my client's design preference), the enlargement image reverts back to the default image when the mouse crosses the gaps between the thumbnails, creating an annoying flash of the default enlargement image while transitioning to the next thumbnail. This script I found on another site doesn't have this flashing of the image, since the enlargement stays visible until another thumbnail is activated by the rollover. I like this feature, and just need to know how to modify the script to allow for another simultaneous rollover image to appear (in place of the thumbnail, as described above).

Can anyone help?

Thanks!

[Nile]

I don't really get what you mean by "Change the image to a jpg", because you said you didn't like it when it was like that-because if flashed- so do you want it to restore to the jpg when your mouse isn't in the 7 picture areas?

[dancingeyes]

Sorry for the confusion...."Change the image to a jpg" was simply referring to the thumbnail changing to another like-sized and positioned image...a normal in-place rollover. My main concern is when one rolls over from, say, the second thumbnail to the third one....I don't want that first default enlargement appearing during the "gap" between the thumbnails, which is why I was OK to have the last-visited enlargement stay visible until the next distinctly different thumbnail is activated, rather than seeing enlargement #2, followed by a brief flash of #1 again, then enlargement #3, and so on. This code I found and am using here seems to let the last-viewed enlargement just hang there, and the above-mentioned flashing doesn't occur....and I'm fine with that.

I just want to add the in-place thumbnail rollover as well, so that the thumbnail rollover appears when moused over. If it happens to hang there there like the enlargement, that's fine too.

Does this help clarify?

[dancingeyes]

Also, to answer the other part of your question, I would think that the mouse would react to the gap between the thumbs and the space outside the thumbs table equally, so if the default images were restored by moving outside of all seven thumbs, I assume the same would happen in between the thumbs too, thus the "flashing" image as you move from thumb to thumb. I'm happy to have the "hanging there" effect if it eliminates the flashing.

[dancingeyes]

Alas, in the interim, I found the solution. I just created the multiple rollover functions (thumbnail rollover and corresponding remote enlargement display) from within Dreamweaver (easy!), and then to solve the "flashing" image, I simply transferred all the rollover code from the IMG to the TD cell itself, thus keeping the thumbnail AND the surrounding margin around the thumb that extends to the border of the TD cell (a.k.a. "the gap") under the mouseOver event until the mouse reaches the next, adjacent TD cell of the table, which contains the next thumbnail. Thus, seamless transitions with no intermittent flashing of the default enlargement image in between. I had never thought to apply such code to a table cell before, but it works!