Slideshows work great in Mozilla, but I get a big blank space in Internet Explorer, both 6 & 7. This is the case on both my test site, and on the example over at Lullabot.com.

It looks as though IE tries to pre-load the images -- I can sometimes see one flash onto the screen for a split second -- but then nothing. And when viewing the source code itself, what's rendered in IE is very different/far less than what you get in Mozilla.

Here's the source when viewed in Mozilla:

<div class="content">
<div style="overflow: hidden; position: relative;" id="slideshow-204-field_image" class="cck-slideshow cck-slideshow-work-field_image"><div class="slideshowLoader" style="display: block; position: absolute; top: 131.5px; left: 82px;"><img src="/sites/all/modules/contrib/cck_slideshow/images/slideshow_loader.gif"></div><div style="overflow: visible; position: absolute; top: 1px; left: 2px; display: block; opacity: 0.9999;" class="slideshowHolder"><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/Picture%204.png"></div><div style="position: absolute; width: 384px; bottom: 0px;" class="slideshowLinks cck-slideshow-links"><a href="#1slideshow-204-field_image" class="slideshowLink" title="">1</a><a href="#2slideshow-204-field_image" class="slideshowLink" title="Daughtry Official served as a prototype for Multsite. After launching Daughtry, we expanded the architecture to support multiple sites.">2</a><a href="#3slideshow-204-field_image" class="slideshowLink" title="Good Charlotte">3</a><a href="#4slideshow-204-field_image" class="slideshowLink active" title="Kelly Clarkson">4</a><a href="#5slideshow-204-field_image" class="slideshowLink" title="Ozzy Osbourne">5</a></div><div style="position: absolute; width: 384px; bottom: 28px;" class="slideshowCaption cck-slideshow-caption">Kelly Clarkson</div><a title="Ozzy Osbourne" style="overflow: hidden; position: absolute; display: block; font-size: 30px; top: 1px; left: 255.333px; width: 126.667px; height: 280px;" href="#5slideshow-204-field_image" class="slideshowNextSlide next-slide">&nbsp;</a><a title="Good Charlotte" style="overflow: hidden; position: absolute; display: block; font-size: 30px; top: 1px; left: 2px; width: 126.667px; height: 280px;" href="#3slideshow-204-field_image" class="slideshowPrevslide previous-slide">&nbsp;</a></div><p>Doug Gottlieb first approached Lullabot...

And here's what I get in IE:

<div class="content">
<div id="slideshow-204-field_image" class="cck-slideshow cck-slideshow-work-field_image"><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/sonybmg.jpg" alt="" title=""  /><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/Picture 2.png" alt="" title="Daughtry Official served as a prototype for Multsite. After launching Daughtry, we expanded the architecture to support multiple sites."  /><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/Picture 3.png" alt="" title="Good Charlotte"  /><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/Picture 4.png" alt="" title="Kelly Clarkson"  /><img src="http://www.lullabot.com/files/imagecache/slideshow/files/images/work/Picture 5.png" alt="" title="Ozzy Osbourne"  /></div><p>Doug Gottlieb first approached Lullabot...

Happy to help troubleshoot this further, of someone can tell me where/what to look for...

TKS

Comments

ryo’s picture

ryo commented
Component: Miscellaneous » Code
Priority: Normal » Critical

Really.
Slideshow does not display at all in IE6.
Look at
http://www.lullabot.com/work/sony_bmg_multisite
in IE.

quicksketch’s picture

quicksketch
he/him
commented

The difference in code is because Firefox updates the code as javascript manipulates it. In IE it just returns the plain HTML source.

Given this, no the module doesn't work in IE at all :P Help would be appreciated, I haven't been able to correct it even though it seems like the Interface Elements website works fine in IE. http://interface.eyecon.ro/demos/slideshow.html

quicksketch’s picture

quicksketch
he/him
commented

Given my difficulty debugging this problem, I'm open to suggestions on tools for debugging javascript in IE. I've tried the javascript Firebug and the IE developer toolbar, neither seemed to be able to assist in the troubles.

quicksketch’s picture

quicksketch
he/him
commented
Status: Active » Fixed

Yay! I figured this out tonight. It's a miracle I found it at all: IE *must* have a 'border' attribute set on the slideshow container. Here's the one-line fix that corrected IE:

      border: 0px; /* IE MUST have a border set for slideshow to work */

Weird huh?

Anyway, I've committed the fix and you can see that our 'demo' site is working correctly: http://www.lullabot.com/work/sony_bmg_multisite

I've released the 1.0 version of the module to celebrate the occasion.

ryo’s picture

ryo commented

Bravo!
Many thanks for your endeaver.

amitaibu’s picture

amitaibu
Primary language Hebrew
Location Israel
commented
Status: Fixed » Active

I'm not sure it is still working properly.
http://gizra-software.com/muslinb/node/21

Actually, also in FF I need to click the first link in order to see the images (e.g. it doesn't appear when the page is loaded)

amitaibu’s picture

amitaibu
Primary language Hebrew
Location Israel
commented

Here's an error in IE7:

Line: 31
Char: 9
Error: 'ss' is null or not an object

jaydub’s picture

jaydub commented

My browser report:

Firefox
- Lullabot site works fine
- test on drupal sandbox fine

IE 6
- Lullabot site does not work
- test on drupal sandbox does not work

Opera
- Lullabot site works fine
- test on drupal sandbox does not work

Safari (Win32)
- Lullabot site does not work
- test on drupal sandbox does not work

IE 6
- yeah right

I like the idea of this module but I guess we'll have to wait for the javascript stuff
to be worked out.

quicksketch’s picture

quicksketch
he/him
commented

I double checked this in IE6 and IE7 and couldn't find any problems (other than the transparent pngs on lullabot.com not being transparent, which was considered in the design). I don't have any plans to make this work on Safari for Windows if it's any different than the Mac version.

Any other reports on this not work in IE6/7 (preferably the demo site, since I know it's setup correctly)?

acouch’s picture

acouch commented
Priority: Critical » Minor

I spent a while trying to figure out why this wasn't working in IE7 and was about to write a long description of my troubles.

But it turned out that an extra div tag that i had put around it for style purposes kept it working for some reason.

Thought I'd throw that out there for anyone playing with this.

Very cool mod.

raplom’s picture

raplom commented

Hi,

I set the border to 1px in the cck_slideshow.module file.
This seems to have ironed out a few problems I'd been having with the placement of the slideshow on the page.
However I'm not entirely certain that the slideshow is functioning properly yet as the pictures sometimes don't load, you can view them by clicking on the links at the bottom.
Here's a page I'm using the slideshow on - http://www.bobbybehan.com/node/30
If anyone notices a problem that may be caused by my theme please let me know.
Other than that I'm happy enough with the outcome of this, it's not perfect yet but getting there.

headkit’s picture

headkit commented

http://www.bobbybehan.com/node/30
and
http://www.lullabot.com/work/sony_bmg_multisite

doesn't work on safari 1.3.2

quicksketch’s picture

quicksketch
he/him
commented
Status: Active » Closed (fixed)

The CCK Slideshow module is no longer maintained.