Image transitions buggy in IE7 (v1.1.1)
March 4, 2008 - 6:51am — gollyg
| Project: | jQuery Lightbox Plugin (balupton edition) |
| Version: | 1.1.1-final |
| Component: | Code |
| Category: | bug report |
| Priority: | normal |
| Assigned: | balupton |
| Status: | closed |
Jump to:
Description
Using version 7.0.5730 of Internet Explorer, the transitions between images do not always work smoothly. The current image fades and then reappears, only to be replaced suddenly (no fade) by the next (correct) image.
The problem seems to be worse when the image has preloaded.
Have not tested other version of IE

Comments
#1
I confirm, bug may be reproduced in both IE6 and IE7. See for example this page.
#2
And the bug is actual for v.1.1.1 too.
#3
I have the same version of IE (7.0.5730.13 to be exact) and I don't see any problems. It's possible that gollyg and sashabe implementations, or some sort of IE plug-in, is causing this. Maybe even a codepage or doctype (I have utf-8 and strict).
www.tomislavdekovic.iz.hr
#4
Thanks for your comment, sheshnjak, i've checked doctype, codepage and the page itself for validity, but the bug is still here(. Here's an example page without additional styles or scripts, XHTML strict, UTF8, with latest unmodified JQ and Lightbox releases. And I don't use any plugins for IE7 (well don't use IE at all:), to be sure i've checked the page on a computer with fresh IE7 install (same version 7.0.5730.13).
BTW, image's "double blinking" happens only with images of exactly the same size. It does not take place when the image canvas needs to be resized.
#5
I tried your example (thanks for letting me digging up your trash ;-) and still don't see the problem, even with the duplicate pictures. I tryed with keyboard navigation and nothing. I have noticed that you switched doctype and encoding. Maybe someone else with the same version of IE7.0.5730.13 will get by this page, try out your example and post a follow up with the answer if he can see a problem. Sorry I couldn't help...
#6
Yeah, that's pretty strange. The only "workaround" i've found yet is to replace the code between "// Animate image" and the next comment with this:
if ( $.browser.msie ) {$('#lightbox-image').fadeIn(10, function() {$.Lightbox.showImage(null, {step:4}); });
} else {
$('#lightbox-image').fadeIn(200, function() {$.Lightbox.showImage(null, {step:4}); });
}
You lose fading then, but images during transitions finally stop blinking.
#7
Maybe you should try this instead, it animates parent div:
if ( $.browser.msie ) {$('#lightbox-imageContainer').hide();
$('#lightbox-image').show();
$('#lightbox-imageContainer').fadeIn(200, function() {$.Lightbox.showImage(null, {step:4}); });
} else {
$('#lightbox-image').fadeIn(200, function() {$.Lightbox.showImage(null, {step:4}); });
}
Since I can't recreate you bug I don't know if it's working. Maybe it will need rearranging in line order, or you could try
$('#lightbox-image').parent().hide().end().show().parent().fadeIn(200, function...#8
Thanks a lot, works as needed, now it's possible to preserve animation in IE)
#9
Could you let me know if this problem has been fixed in v1.2.0-final? Because I have not been able to duplicate it.
If not, I will see about applying sheshjnak's fix here:
http://plugins.jquery.com/comment/reply/1804#comment-1138
I'm running 7.0.6001.18000 (vista), so perhaps it is only for xp editions?
#10
I can confirm that it is only present in IE7 on a Windows XP machine. I will have a fix out for the next release. Thanks for all your help on this.
#11
This has been fixed in the upcoming version, what occurred was that in step one, the preloader would fire step 2 before we complete step 1, so thus the lightbox runs twice.