As requested by a few posters at getsatisfaction.com I will post my effort to make Galleria from galleria.aino.se compatible with IE 6 today and give a few hints to problems with IE 7 and IE 8. For those who run the classic theme I am sorry, we needed only a lightbox theme so far so thats what I will describe below.

I think all the Javascript code included in Galleria runs in IE 6. The one big problem is the themes and their CSS code. I managed to get it working in IE 6, but there are still a few small visual glitches, e. g. transparent PNGs. If it really disturbs you you can fix it easily. Our policy regarding IE 6 is to support it so far, that the site is readable and usable, but we will overlook some minor design problems as we hope more and more people start using good browsers.

Here is the Galleria with our theme, click on one of the images to open the Galleria Lightbox:

This part is needed to fix displaying and loading errors in IE 7 and 8. 

As far as I debugged the issue the theme CSS loading code does not work well in IE7 and 8. My solution was to load the CSS of the theme from the HTML file. To do this you need to follow these steps:

1. Edit the theme .js file and comment the css line out like below::
   

   
    //css: 'galleria.[THEMENAME].css',
   
    

   
   


2. Include the css file in the HTML file of your page:
   

   
    < link rel="stylesheet" type="text/css" href="[PATH_TO_GALLERIA]/themes/[THEMENAME]/galleria.[THEMENAME].css" />
   
    

   
   


3. Patch galleria to load the theme without css,
   original code (in my galleria version this code appears around line 1343):
   

   
    if (obj.css) {
            var css;
            proto.loop(proto.getElements('script'), function(el) {
                var reg = new RegExp('galleria.' + obj.name.toLowerCase() + '.js');
                if(reg.test(el.src)) {
                    css = el.src.replace(/[^\/]*$/, "") + obj.css;
                    proto.loadCSS(css, function() {
                        G.theme = theme;
                        jQuery(document).trigger( G.THEMELOAD );
                    });
                }
            });
            if (!css) {
                G.raise('No theme CSS loaded');
            }
        } 
        return theme;
    

   
   Add the lines at the end:
   

   
    if (obj.css) {
            var css;
            proto.loop(proto.getElements('script'), function(el) {
                var reg = new RegExp('galleria.' + obj.name.toLowerCase() + '.js');
                if(reg.test(el.src)) {
                    css = el.src.replace(/[^\/]*$/, "") + obj.css;
                    proto.loadCSS(css, function() {
                        G.theme = theme;
                        jQuery(document).trigger( G.THEMELOAD );
                    });
                }
            });
            if (!css) {
                G.raise('No theme CSS loaded');
            }
        } else {     //########### EDIT HERE ###########
    	G.theme = theme; 
            jQuery(document).trigger( G.THEMELOAD );
        }
        return theme;
    

   
   

IE 6 does not know the "position: fixed" style. So I changed all this to "position: absolute" only for IE 6 using the star hack (see galleria.jnw-lightbox.css, at the end).

This works now, but our lightbox shows up on top of the page, even if we scrolled down before and may not be visible. I used an ugly hack for this: As soon as the lightbox opens, I set the scroll position to 0. And when the user closes the light box, I scroll to the position I saved before. These changes can be found in galleria.jnw-lightbox.js at line 94 and line 139/140.

Thats all, and here are all files including the patched theme and Galleria:

galleria-lightbox-ie6.zip

It is still not very beautiful in IE 6 because the transparent PNGs are not working, but this can easily fixed by converting them to GIFs or using the IE 6 PNG fix.

EDIT: Updated CSS and ZIP file. There still was a problem with height in IE 6. The key to get Galleria themes running in IE6 is avoiding "position:fixed" and setting width and height for all elements surrounding the gallery. This includes the elements html and body, set width and height for them to 100%!

To get the Lightbox working on this page I had to set a fixed height for the stage. Depending on the surrounding layout it may work with height:100% as well, as you can see here: http://www.niederwald.de/en/conferences/conference-rooms.html

And excuse the layout bugs in IE 6 on this page, our policy for our website is to maintain functionality and readability for IE 6 users, but we will not spend our time to fix all design glitches. The site linked above is a customer site. As the target audience of that site includes a significant fraction of IE 6 users IE 6 is 99% supported there.

Hope this helps all brave fighters against IE 6!