Databases
StackOverflow2013
Postsdbo
POjQuery offset() not working in some browsers, on some computers
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery offset() not working in some browsers, on some computers
    primarykey
    data
    text
    <p>I have a problem positioning an element in certain browsers. I'm using the jQuery autocomplete found <a href="http://code.google.com/p/jquery-autocomplete/" rel="nofollow noreferrer">here</a>. The div containing autocomplete values should be directly under the text box, and line up perfectly. The code sets the css left property of the div by using the left property generated by <code>$(textbox).offset();</code></p> <p>After un-packing the code to try and fix my problem, I get this:</p> <pre><code>var a = $(textbox).offset(); element.css({ width: typeof e.width == "string" || e.width &gt; 0 ? e.width : $(textbox).width(), top: a.top + textbox.offsetHeight, left: a.left }).show(); </code></pre> <p>This seems like it should work, and it does work in Firefox. It doesn't work in IE8, Chrome. The top position is always correct, but the sometimes the div is too far to the left, or too far to the right.</p> <p>On different computers (all with Windows XP), it works in IE8... how can this be? I've also tested it on my Mac, OS 10.5. It works in Firefox, but not Safari.</p> <p>I've disabled plug-ins, changed screen resolutions, re-sized windows... It just inconsistently works in some places sometimes.</p> <p>Can anyone think of something I'm missing?</p> <p><strong>UPDATE</strong>: I have re-worked my code to use the autocomplete supplied with jQuery 1.4.2 and <a href="http://jqueryui.com/" rel="nofollow noreferrer">jQuery UI</a> 1.8rc3. It is still broken, same problem. Please help!</p> <p><strong>UPDATE 2</strong>: See <a href="https://stackoverflow.com/questions/2456005/jquery-ui-autocomplete-not-working-in-ie">this related question</a>. jQuery UI autocomplete breaks because it uses offset. Does anyone have a work around?</p> <p>Here is the javascript from the UI autocomplete function that trips up:</p> <pre><code>.css({ top: (offset.top + this.element.height) + 'px', left: offset.left + 'px' }) </code></pre> <p>If it is changed to <code>top: '0px', left: '0px'</code> it works fine, but is obviously positioned in the wrong spot.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USPeter Di Cecco
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. USJoel Martinez
      1. VTFavorite
    2. VO
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. This table or related slice is empty.
      1. VTUpMod
    1. COx64 vs x32 rendering engines?
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. USJosh E
    2. CO@Josh: not sure what you mean. All computers have 32 bit processors, and 32 bit windows xp
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. USPeter Di Cecco
    3. COThis "offset" vs. "position" thing always confuses me. If this were my code, I'd try: (A) use "position()" instead of "offset()" and (B) see what happens when I wrap the problematic HTML in a "position: relative" div.
      singulars
      1. POjQuery offset() not working in some browsers, on some computers
      1. USPointy
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload