Tester Tester - 1 year ago 112
jQuery Question

Can not set jquery ui dialog overlay background color

I want to set the Jquery UI dialog overlay background to different color. The following CSS is not working.

.ui-widget-overlay{background:red;}


Please see fiddle.

Answer Source

You need to add the modal option to the dialogue settings then your fiddle will work.

$("#dialog").dialog({
  width: 300,
  resizable: false,
  draggable: false,
  modal: true
});

FYI I found this out by using the F12 feature in Chrome and looking for the overlay element which was not present. That led me to the JQuery UI docs.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download