CODEWITHSUNDEEP
jqueryfirefoxgoogle-chromecross-browser
marcamillion
marcamillion

Reputation: 33775

Discrepancy between outputs from firefox and chrome for 'console.log'

Why would firefox give me the correct output but Chrome doesn't ?

I am trying to find the height of a div that has not been specified in the stylesheet or anywhere else.

Chrome gives me the integer value of '20', but firefox gives me the correct value (using firebug) of 516.

This is the code I am using to generate the console.log:

var img_h = $("#pics").height();
    console.log(img_h);

<div id="pics" width="100%">
        <img src="image1.jpg" width="45%">
        <img src="image2.jpg" width="45%">
    </div>

Thoughts?

Upvotes: 0

Views: 260

Answers (2)

Nick Craver
Nick Craver

Reputation: 630579

If you want images to be loaded, instead of document.ready you should use window.onload, like this:

$(window).load(function() {
  var img_h = $("#pics").height();
  console.log(img_h);
});

The most notable difference is that images (not created dynamically!) are loaded and ready when this code runs.

Upvotes: 2

hookedonwinter
hookedonwinter

Reputation: 12666

This is not the solution, but I'm leaving it up so no one else offers it either.

Not positive, by try wrapping the jquery in the doc ready wrapper:

$( document ).ready(function(){
    //your code
});

Just a theory, but it could be that the element isn't actually loaded yet when the console.log is firing.

Upvotes: 0

Related Questions