John John - 1 year ago 86
jQuery Question

CSS Drop Down Menu behind JQuery Dialog

The drop down menu is currently showing behind the JQuery dialog box. I'd like to show the drop down menu in front of the dialog box. I tried to change the z-index, but no luck.

$( function() {
$( "#dialog-1" ).dialog({
appendTo: $("#bodyContent")
} );


Thank you!

Answer Source

The dialog box has a z-index: 1003; so to overlap it you need to give the dropdown menu a bigger value more than 1003

see demo

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