Duh... I figured it out...
It was the Browser.fixPNG() method call. It seems that it changes the
background-image to "none" when it applies the transform....I just
needed to move it one line lower.
On Sep 24, 10:13 am, jonlb <[EMAIL PROTECTED]> wrote:
> Hello!
>
> I'm trying to do some image swapping with the background of a div. It
> works fine in FF2 + 3 but not in IE. It seems when I try to get the
> background-image style of the div in question it's returning
> "none" (at least it is in the MS Script Editor). Anyone see any
> problems with the following that would cause this issue?
>
> window.addEvent('domready', function(){
> debugger;
> var spine = $('spine');
> Browser.fixPNG(spine);
> var originalPic = spine.getStyle('background-image'); ///This is
> returning "none" in IE6
> var boxes = $$('#spine div');
> var preLoadedPics = new Hash();
>
> //preload pics
> boxes.each(function(item){
> debugger;
> id = item.get('id');
> if ($defined(id)) {
> s = '_'+id+'.png';
> pic = originalPic.replace('.png)',s);
> pic = pic.replace('url(','');
> preLoadedPics.include(id,new Asset.image(pic));
> }
> });
>
> boxes.addEvent('mouseover',function(event){
> debugger;
> var id = $(this).get('id');
> var img = preLoadedPics.get(id);
> if ($defined(img)) {
> var pic = 'url('+img.get('src')+')';
> spine.setStyle('background-image',pic);
> Browser.fixPNG(spine);
> $(this).addClass('over');
> }
> });
> boxes.addEvent('mouseout',function(event){
> debugger;
> spine.setStyle('background-image',originalPic);
> $(this).removeClass('over');
> });
>
> });
>
> Thanks!
> Jonlb
