Hi,
I've run into a problem using sortable on IE where the item being
dragged in a sortable container is vertically offset by the amount
I've scrolled down the page.
To further detail the problem:
- build a sortable div with "items"
- open page in IE, scroll down a little bit and attempt to drag a
sortable. You'll see that the helper div is offset above the mouse
pointer by the amount you've scrolled down
Naturally FF works just fine.
I've read some similar posts here but all suggest wrapping in a div
which did not work for me. I believe Paul commented on this issue as
well and basically concluded it was an IE problem.
I've found a pretty good fix though:
- in the sortable use the appendTo option to append to a
position:fixed div. Of course IE doesn't recognize position:fixed
either so you'll need to do the funky css dynamic positioning:
<style type="text/css">
#widgetDrag {
/* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this
*/
position: absolute; left: 20px; top: 10px;
z-index:1000;
}
body > div#widgetDrag {
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb
4.5+, iCab, ICEbrowser */
position: fixed;
}
</style>
<!--[if gte IE 5.5]>
<![if lt IE 7]>
<style type="text/css">
div#widgetDrag {
/* IE5.5+/Win - this is more specific than the IE 5.0 version */
left: expression( ( 20 + ( ignoreMe2 =
document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft ) ) +
'px' );
top: expression( ( 10 + ( ignoreMe =
document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop ) ) +
'px' );
}
</style>
<![endif]>
<![endif]-->
<div id="widgetDrag" style="width:200px; height:50px; background-
color:#ffffff;">test</div>
This'll solve the problem until it's addressed in UI. Paul - do you
know if this issue will be addressed in the 1.5 release?
Thanks,
Sam