Question

One of our devs through together a banner rotater, and while it works fine in NOT IE, IE is throwing an error at line 30 (marked below with “***** ERROR ON NEXT LINE”). Can I not sort $$(‘.banner’)?

The error is:
‘Object doesn’t support this property or method’

Using Prototype 1.6.0.3

function changeBanners() {

  // banners are now sorted by their z index so that
  // the ones most in front should be most on top in the DOM
  // ***** ERROR ON NEXT LINE

  banners = $$('.banner').sort(function (a,b){
    _a = parseInt(a.style.zIndex);
    _b = parseInt(b.style.zIndex);
    return _a < _b ? 1 : _a > _b ? -1 : 0;
  });

  // increment z index on all of the banners
  Element.extend(banners);

  banners.each( function (banner){

    Element.extend(banner);
    banner.style.zIndex = parseInt(banner.style.zIndex) + 1;
  });

  // move the first banner to be the last
  first_banner = banners.shift();
  banners.push(first_banner);

  // set it invisible
  Effect.toggle( first_banner.id , 'appear' , {
    duration: 2.0,
    afterFinish: function(){
      first_banner.style.zIndex = 0;  // update its z index so that it is at the end in the DOM also
      first_banner.show();            // make it reappear so that when the one in front of it disappears, it will show through
    }
  });
};

Answer 1

*Sigh*

After all of that, it’s my lack of remembering to declare variables in JS

Changed:

banners = $$('.banner').sort(function (a,b){
    _a = parseInt(a.style.zIndex);
    _b = parseInt(b.style.zIndex);
    return _a < _b ? 1 : _a > _b ? -1 : 0;
  });

to:

var banners = $$('.banner').sort(function (a,b){
    _a = parseInt(a.style.zIndex);
    _b = parseInt(b.style.zIndex);
    return _a < _b ? 1 : _a > _b ? -1 : 0;
  });

Works fine.