StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>This might be a related bug report, it's been around for quite a while: <a href="http://bugs.jqueryui.com/ticket/3740">http://bugs.jqueryui.com/ticket/3740</a></p> <p>It seems to happen on every browser I tested (Chrome, FF4, IE9). There are a few ways you can work around this issue:</p> <p><strong>1.</strong> Use <code>position:absolute;</code> in your css. Absolutely positioned elements don't seem to be affected.</p> <p><strong>2.</strong> Make sure the parent element (event if it's the body) has <code>overflow:auto;</code> set. My test showed that this solution fixes the position, but it disables the autoscroll functionality. You can still scroll using the mousewheel or the arrow keys.</p> <p><strong>3.</strong> Apply the fix suggested in the above bug report manually and test thouroughly if it causes other problems.</p> <p><strong>4.</strong> Wait for an official fix. It's scheduled to jQuery UI 1.9, although it has been postponed a few times in the past.</p> <p><strong>5.</strong> If you're confident that it happens on every browser, you can put these hacks into the affected draggables' events to correct the calculations. It's a lot of different browsers to test though, so it should only be used as a last resort:</p> <pre><code>$('.drag').draggable({ scroll:true, start: function(){ $(this).data("startingScrollTop",$(this).parent().scrollTop()); }, drag: function(event,ui){ var st = parseInt($(this).data("startingScrollTop")); ui.position.top -= $(this).parent().scrollTop() - st; } }); </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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