Link to home
Start Free TrialLog in
Avatar of YZlat
YZlatFlag for United States of America

asked on

After JQuery UI dialog is closed, the page remains grayed out

I have an JQuery UI dialog on my page and it unwanted scrollbars I want to get rid of. Resizing the dialog did not help and neither did setting maxHeight and maxWidth

    <!DOCTYPE html>
        <meta charset="utf-8" />
        <link href="Content/themes/base/jquery-ui.css" rel="stylesheet" />
        <script src="Scripts/jquery-1.6.4.js"></script>
        <script src="Scripts/jquery-ui-1.11.4.js"></script>
            $(document).ready(function () {
                $(".hlk1").click(function () {
                    var linkId = $(this).attr("linkID");
                    // initialize dialog
                    var dlg = $("#dialog").dialog({
                        autoOpen: false,
                        modal: true,
                        draggable: false,
                        resizable: false,
                        position: { my: "center", at: "center", of: window },
                        height: 380,
                        width: 530,
                        maxHeight: 450,
                    maxWidth: 600,
                    open: function(){
                        $('body').css('overflow', 'hidden');
                        $('.ui-widget-overlay').css('width', '100%‌​');
                        $('.ui-widget-overlay').css('height', '100%');
                    close: function () {
                        $('body').css('overflow', 'auto');

                // load content and open dialog
                dlg.load('page2.html?id=' + linkId).dialog('open');

    <a href="#" class="hlk1" linkid="305">Click here</a>
    <a href="#" class="hlk1" linkid="890">Click here</a>
    <div id="dialog"></div>

Open in new window

Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Here is your code (

What I am looking for?
Avatar of YZlat


Julian, this is strange, your code does not ass scrollbars but mine does
Without seeing the code as a link where we can see what is happening have to go on the premise that the code posted is correct and there is something you have not given us.

Can you give us a link?
Avatar of YZlat
Flag of United States of America image

Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of YZlat


resolved it myself