use browser default scrollbar on jquery ui modal dialog

Question

Is it possible to use jquery ui's dialog, and span it across the full browser height?

Then, if there is extra page, use the browser default scrollbar to go up and down, freezing the rest of the page behind the overlay?

$(function()
  {
    $('#category_modal').dialog({
        autoOpen: false,
        title: 'hello',
        modal: true,
        height: auto,
        width: 500,
        resizable: false
    });
});

Jack · Accepted Answer · 2013-01-14 22:13:52Z

1

Not using the default dialog. You can make the dialog 100% height/width and "overflow" text scrollable using CSS. Your dialog would look something like this in CSS:

#dialog_box {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

You could also put an iFrame within the dialog if you wanted. However, this is no way to completely "Freeze" what is in the background. The user can always select the background and use the mouse-wheel or simply use the browser's scroll bar. Using overflow-y will create a 2nd scroll bar on the edge of the dialog that will scroll the content within (should you need to).

answered Jan 14, 2013 at 22:13

Jack

1,3861 gold badge8 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

use browser default scrollbar on jquery ui modal dialog

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related