Following on from another thread in this forum I am trying to make a slideshow with a fade in/out effect. In some versions of IE I have tested it is not working properly: IE 6 and IE 7.0.5730.11IC. In 7.0.5730.11 and 7.0.6000.16575 it works okay.
To see the problem please see
http://www.iliveinabin.com/SlideShow...howV3Pics.html. Wait for the daffodil pic to load then click on the lock picture. It should fade in the lock pic and the daffodil turns nearly transparent (it's meant to be totally transparent). If you don't get this problem please refresh the page and try again, or wait for another pic to load and then click on the lock again, the problem doesn't happen everytime, which makes it even weirder.
Now, if you look at the code for the page, you should see that once the lock image has faded in after you click on it the function slideshow() will trigger, which sets the opacity of the previous image displayed (the daffodil in this example) to 0% and the current image (the lock) to 100%. I have put a div in the page that tells you the images that have just had their opacity set to 0% and 100%. You can also click the 'clicky' link in top left corner to check opacity of all current images. If you do this when the problem occurs you will see that the opacity of the daffodil has not been set to zero and is about 13% and the lock's opacity is not 100%, only about 89%.
I can bodge round this problem by setting the image style.display = "none" at the same time as setting opacity to 0, which gets rid of the 13% opaque daffodil, but the lock image would still be only 89% opaque.
I have spent about 3 days trying to find out why this happening and how to fix it, but I can't figure it out. Is it something wrong with my code or is it a bug in IE?
Submit Your Article
Announcements
Contact
