Firefox and Chrome give different values for offsetTop

Question

I am trying to position an span element (let us call it \"the tooltip span\") relative to a input field. To do this, I am wrapping the tooltip span and the input field in anothe

Answer 1

I ran into the same problem, and jQuery's position() function was reporting the same as the offset() function. Ultimately it turns out that even waiting for the document to be ready didn't work for me. I had to check offset() later in the flow (in my case, in my handler that is fired on a window.scroll event).

When I try this test code below, on page load, I get different figures for Firefox + Chrome. Once it loads, however, I can press 'd' and I get the same figure for both browsers.

// this produced different results on Chrome + Firefox (Chrome was wrong!)
$(document).ready(function () {
   var x =  $('#some-div-on-your-page').position().top;
   alert("On load, offset is "+x);   // Chrome + Firefox report diff figures

  $(window).keydown(function(e, r) {
     k = e ? e.keyCode : event.keyCode;
     if(k == 68) {      // press 'd'
        var x =  $('#some-div-on-your-page').position().top;
        alert("Now the offset is "+x); // ...but this is consistent
     }
   });
}

Hope this helps.