On Sat, 21 Aug 2004 10:58:49 GMT, Mehdi <no****@nospam.nospam> wrote:
I have 3 small images on my page. I also have a large image which is
displayed when any of the 3 small images is clicked. I do this to
display a large version of each image. On page load the large image
displays the img1 by default.
But sometimes (in IE and NS) when I click on small images, the large
image is empty and if I refresh the page it will display it. Here is my
code:
function ChangeImage(Img)
{
document.getElementById("LargeImg").src =
document.getElementById(Img).src;
}
and on click event of each small image I have:
OnClick="ChangeImage('Img1')"
OnClick="ChangeImage('Img2')"
OnClick="ChangeImage('Img3')"
The code you've presented suggests that you aren't using small and large
images, but large images that have been shrunk using the height and width
attributes. If this is correct, the problem might be because the images
haven't finished loading. I couldn't really say without seeing the actual
page.
Of course, it could just be a bug. When I used IE, I noticed problems with
rollovers, but I think that it's because IE is so badly written, it wasn't
executing the correct code, or using the correct HTML[1].
What I will say though, is that it's preferable to access images using the
images collection, rather than getElementById().
function ChangeImage(img) {
document.images['LargeImg'].src = document.images[img].src;
}
Mike
[1] When I browse the Internet, I often use multiple windows (or tabs, now
I use Opera). IE seemed to confuse what data should go where and load
images from one page into another, or use images that should have been
located elsewhere on the page. I hate IE.
--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.