Jquery UI selectmenu does not go "on top" of all other page elements (uniForm issues)

I use uniForm (http://sprawsm.com/uni-form/) and the jQuery UI selection menu (http://jsfiddle.net/fnagel/hsn95/light/).

The problem is that the dropdown does not go "on top" of the uniForm elements ... so it really looks funny. I tried changing the z-index for selectmenu.css but no luck ....

Any ideas anybody?

I must add that I removed this from uniForm and have no problems, but I am afraid there must be a reason.

z-index:1;
+3
source share
8 answers

Here is the answer of my answer to the same question that you posted on the Uni-Form support forum:

, z-index.

, Uni-Form z-index, , : relative; z- , , , , . , , jQuery SelectMenu z-index ( ).

z-index Uni-Form , z- ( 1) jQuery SelectMenu.

+3

z-index, jQuery selectmenu.

, z- selectmenu.

- :

var dialogZindex = $('.ui-dialog').css('z-index');
$('.ui-selectmenu-menu-dropdown').css('z-index', dialogZindex);
+3

z-, . .

<select style='position:relative;z-index:100'>
+3

JQuery UI, Foundation, .

, , CSS:

.ui-front{ z-index:1010; } /*get in front of .reveal-modal z-index:1005*/

+1

selectmenu.

$( "#myid" ).selectmenu({width:100});

.

0

.

$("#selectId").selectmenu("menuWidget").parent().css("z-index", "9999");
0

Android Chrome (https://developer.chrome.com/devtools/docs/remote-debugging), jQuery UI popup (.ui- popup-container) z- :

.ui-popup-container {
    z-index: 1000010;
}

z- , z-, , .

0

, "appendTo" selectmenu. id/class , , . .

0

All Articles