Scrollbar problem with jquery ui dialog in Chrome and Safari
Posted
by alexis.kennedy
on Stack Overflow
See other posts from Stack Overflow
or by alexis.kennedy
Published on 2009-10-24T10:44:03Z
Indexed on
2010/05/15
21:24 UTC
Read the original article
Hit count: 975
I'm using the jquery ui dialog with modal=true. In Chrome and Safari, this disables scrolling via the scroll bar and cursor keys (scrolling with the mouse wheel and page up/down still works).
This is a problem if the dialog is too tall to fit on one page - users on a laptop get frustrated.
Someone raised this three months ago on the jquery bug tracker - http://dev.jqueryui.com/ticket/4671 - it doesn't look like fixing it is a priority. :)
So does anyone
(i) have a fix for this? (ii) have a suggested workaround that would give a decent usability experience? I'm experimenting with mouseover / scrollto on bits of the form, but it's not a great solution :(
EDIT: props to Rowan Beentje (who's not on SO afaict) for finding a solution to this. jQueryUI prevents scrolling by capturing the mouseup / mousedown events. So this:
$("dialogId").dialog({ open: function(event, ui) { window.setTimeout(function() { jQuery(document) .unbind('mousedown.dialog-overlay') .unbind('mouseup.dialog-overlay') ; }, 100); }, modal: true});
seems to fix it. Use at own risk, I don't know what other unmodal behaviour unbinding this stuff might allow.
© Stack Overflow or respective owner