Reputation: 3066
I came across this weird problem in Firefox mobile. Other browsers don't have this problem.
$(document).ready(function(){ alert( $(window).height()); });
This ALWAYS prints the wrong height of the window. It is really 1544px, but the alert shows 480px. Now if I add a simple alert before the current one:
$(document).ready(function(){ alert("wait"); alert($(window).height()); });
then suddenly the correct height is given. Hence, I think the onready event fires before the document is actually ready and the first alert waits, giving enough time for the document to get ready. Does anyone know how to get pass this?
EDIT: $(window).load has the same problem
EDIT2: The more I look into this, the weirder it gets. It seems that the window onload event is fired before the jquery file is completely downloaded. Here is the first test: http://visore.org/test/test1.html You will have to clear the cache data (Menu -> Settings -> Privacy -> Clear Now) before visiting the page. You will notice that if you continue reloading the page a lot, sometimes the correct height is given (mostly only the first visit after clearing the cache shows the incorrect height). Here is the second test with 2 alerts: http://visore.org/test/test2.html This one always gives the correct height. Again, the problem is only on Firefox Android mobile.
Upvotes: 2
Views: 1879
Reputation: 463
$(document).ready is fired when the page is ready to be manipulated by jQuery. You should be using:
$( window ).load(function() {
alert( $(window).height());
});
Upvotes: 2