Chrome vs. Safari JavaScript

Viewed 1431

I've noticed that my events trigger differently in Chrome vs. Safari. Firefox (largely) acts the same as Chrome. However I've somehow stumbled across the fact that Chrome and Safari seem to load or execute JS at different times. For example, code that works 100% on Chrome will not work in Safari because Chrome calculates the height of a div (for example) after the page is loaded and Safari does it before. Or, at least I think that's the issue.

    ...
    $(window).on('load', function() {
      $('.menu-feature-wrapper').each(function(){
        menuHeight = $(this).outerHeight();
        $(this).find('.col-md-4').css('height', menuHeight);
      });
    });
    ...

In this example snippet - with about 200 additional lines of JS above and below, I had to wrap the working Chrome code (which is all wrapped in $(document).ready of course) with $(window).on('load'... to make it calculate the heights properly in Safari, even though it was acting as expected in Chrome.

My question is this: what's the deal with javascript between Chrome and Safari? Should I just be aware that certain events need to be executed after the entirety of the page loads and that Safari will expect that? Do they actually load JS at different times, regardless of where I include them in the DOM (header vs. footer)? Further, is there some place that explains this? I may just be bad at the Google, but I found very sparse information on how JavaScript is treated between Safari and Chrome, and all other browsers for that fact.

Thanks in advance for pointers/links!

0 Answers
Related