Question

is there any event to be handled between the dom:loaded and load using Prototype javascript framework?
I’ve implemented a preloader using prototype which is looking like this:

Event.observe(window,'load',preload); function preload(){     if($('wrapper'))         $('wrapper').setStyle({'display':'block'});     if($('loading'))         setTimeout('$('loading').fade({duration: 5.0});',4000); } 

then I’ve an another handler using for column height fixatioan which is:

Event.observe(window,'load',function(){      var bottomExtraOffset = (Prototype.Browser.IE) ? 100 : 130;     if(parseInt($$('.col1')[0].getStyle('height')) > parseInt($$('.col2')[0].getStyle('height')))         $('wrapper').setStyle({'height' : parseInt($$('.col1')[0].getStyle('height'))+bottomExtraOffset+'px'});      else         $('wrapper').setStyle({'height' : parseInt($$('.col2')[0].getStyle('height'))+bottomExtraOffset+'px'}); });//observe     

It’s working pretty nice in any browser but IE! It seems that IE is not appending the second handler to the onload handlers list, so when the first one is trying to get height of any of columns it returns 0 coz it’s still displayed as none.

is there any other event than load & dom:loaded to be handled and get me outta this!?

Answer 1

There’s no such event AFAIK, and even the dom:loaded event is implemented by Prototype developers and that’s not a default event in JS. You might want to use a helper to make a delay in performing of the second handler, so the first one will be performed first:

function foo(){      var bottomExtraOffset = (Prototype.Browser.IE) ? 100 : 130;     if (parseInt($$('.col1')[0].getStyle('height')) > parseInt($$('.col2')[0].getStyle('height'))) {         $('wrapper').setStyle({'height' : parseInt($$('.col1')[0].getStyle('height')) + bottomExtraOffset + 'px'});      }     else {         $('wrapper').setStyle({'height' : parseInt($$('.col2')[0].getStyle('height')) + bottomExtraOffset + 'px'});     } }  function bar() {   // One msec delay.   setTimeout(foo, 1); }  Event.observe(window, 'load', bar); // or window.observe('load',bar); 

Also, you can check if the user agent is some hell like IE, then use this method and your said one otherwise.