Scrollbar problem with jquery ui dialog in Chrome and Safari
- by alexis.kennedy
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.
