Opened 6 years ago

Closed 6 years ago

#14930 closed bug (notabug)

zIndex not returning highest zIndex

Reported by: asc99c Owned by:
Priority: minor Milestone: none
Component: ui.core Version: 1.11.3
Keywords: Cc:
Blocked by: Blocking:



I've noticed a problem with zIndex when using an autocomplete widget. I've got a 'popup' dialog which greys out the page background, which leads to some (potentially unusual) z-Index usage to make everything work nicely.

The grey overlay is at zIndex 4, while the element with the autocomplete added has a zIndex of 2 (there was a reason for this that someone explained to me!), but it's a child of an element with zIndex 5, so it appears on top of the overlay.

However the auto-complete widget uses zIndex() + 1 of it's direct target, which returns 3, and then displays under the grey overlay.

I've got a workaround by using the open() event to fix the zIndex, but I'm wondering is this something that the core zIndex function should do? (Or is my zIndex usage too weird to contemplate!)

My zIndex fix is just taking the maximum of the parent tree and leaves the autocomplete widget displayed with zIndex 6:

  fixAutoSuggestZIndex: function(event, ui) {
    var target = $(;
    var widget = target.autocomplete("widget");
    var maxz = target.zIndex();

    while( target.length && target[0] !== document )
      var z = target.zIndex();
      if( z > maxz )
        maxz = z;

      target = target.parent();
    widget.zIndex(maxz + 1);

Change History (1)

comment:1 Changed 6 years ago by Scott González

Resolution: notabug
Status: newclosed

It doesn't sound like there's actually a bug here. Also, .zIndex() was deprecated in 1.11.0 and will be removed in 1.12.0 (this has already happened in master and release in 1.12.0-beta.1).

Note: See TracTickets for help on using tickets.