JoProte
JoProte

Reputation: 57

how to run $(window).load() even if something on the page fails to load

I'm using $(window).load() to re-size the minimum height of a text field based on various other heights that change on page load. My script works fine, however, if another script on the page fails to load (for some unknown reason) the $(window).load() doesn't run.

Is there a way to get the $(window).load() to run even if an error has occurred (maybe using .error()), i.e. bypass the errored script?

my current script for the load() event is below if this helps:

$(window).load(function() { 
var imageArea = $('.imageArea').height();
var productDetail = $('.productDetail').height();
var productText = (imageArea - productDetail) - 110; //-110 is the height of another element
$('.productText').css('min-height', productText);
});

Upvotes: 0

Views: 75

Answers (2)

Mike S.
Mike S.

Reputation: 4879

You should consider using media queries in your CSS and the meta viewport tag in your code if you want your page responsive.

For your image you could add this to your CSS:

img {
    max-width: 100%;
    height: auto;
}

Some browsers need more help:

@media \0screen {
  img { 
    width: auto; /* for ie 8 */
  }
}

Other articles:

Similar to this for a background image:

@media (min-width:800px) { background-image: url(bg-800.jpg) }
@media (min-width:1024px) { background-image: url(bg-1024.jpg) }
@media (min-width:1280px) { background-image: url(bg-1280.jpg) }

Upvotes: 2

Shikiryu
Shikiryu

Reputation: 10219

You could try :

window.onerror = function(){
    var imageArea = $('.imageArea').height();
    var productDetail = $('.productDetail').height();
    var productText = (imageArea - productDetail) - 110; //-110 is the height of another element
    $('.productText').css('min-height', productText);
}

wishing jQuery is loaded…

Upvotes: 0

Related Questions