Hello all, I've just stared playing around with JQuery UI's modal dialog box and have run into two distinct problems.

  1. I have the modal option set to 'true' but the page doesn't dim. The rest of the page is disabled, it just doesn't look like it.
  2. There is no box, just the text with a close link at the top.

I'm sure these are simple problems, but I couldn't find the answers anywhere else so I thought I'd ask here

Scripting function:

/*set inital modal dialog warning*/  
$(function() {  
    $("#dialog").dialog({  
        height: 140,
        modal: true
    });
});

HTML:
<div id="dialog" title="Basic modal dialog">

`<p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>`  

</div>

All comments are greatly appreciated. Thanks in advance :)

1 answer

danwellman 5600
1
point
This was chosen as the best answer

It sounds like you aren't linking to the theme files correctly. Are you using this in the head of your page:

<link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.7.2.custom.css">

I'm pretty sure ui-lightness is the default theme. If you chose a different theme when you downloaded it, you'll need to replace ui-lightness with the name of the theme...

Answered almost 7 years ago by danwellman