Take the 2-minute tour ×

I have a script, that works fine in FireFox, IE, but not in Chrome after F5 refresh only! It does work in chrome, if I focus the url address and click enter, but it doesnt work if I press F5, I don't get it at all, how can this have an effect on the jQuery code.

So here's the script:

$(document).ready(function() {
    var width = 0;
    width += $(this).outerWidth(true);

    $('#offer #gallery').css('width', width + 'px');

And the result of Width should be 820, but I only get this if I refresh the site by focusing the url address and clicking enter, otherwise it gives the result of 90.

I tryed restarting browser and deleting cache, so the problem isn't there, any ideas?

share|improve this question
Well, and the images are not the same size, but in case of clicking F5, the width is ALWAYS 18. Don't know why. –  Mike Jun 28 '11 at 10:33
If log something to the console.. do you see that at the times that you think the script isnt running? –  Duncan_m Jun 28 '11 at 10:34
console.log($(this).outerWidth(true)); returns 5x 18 after F5 refresh and 178, 108, 3x178 if I enter the page any other way. –  Mike Jun 28 '11 at 10:38
So at the end, I used PHP to calculate the width, but I still don't know why I couldn't use the outerWidth function. –  Mike Jun 28 '11 at 10:58
add comment

3 Answers

To correct this problem use:


Out instead of:

share|improve this answer
thanks, this solution saved my day. –  arjuncc Feb 22 '13 at 10:31
Thanks, I was stuck for hours ! –  Epoc Sep 20 '13 at 8:27
add comment

I'd guess that this happens because the images have not yet been loaded when the ready() event is triggered, and 18px is the size of the placeholder icon for images. Pressing F5 causes all resources in the page to be reloaded, while normal navigation does not.

You could try replacing the ready() call with a load() call, or supplying width and height attributes in your img tags so that their size is known before the images are loaded.

From JQuery API for .load():


And from .ready():


share|improve this answer
add comment

I had a similar problem trying to call a custom js library. I was also using a combination of jquery and jquerymobile.

Both $(window).load(function() {}); and $(document).ready(function() {}); were failing. Using:

$(document).on("pageinit", function () {});

solved my case.

share|improve this answer
add comment

Your Answer


