Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Timepicker displays behind container when hosted in some non-jQuery UI dialog containers #62

Closed
mark-larter opened this issue Jan 29, 2013 · 1 comment

Comments

@mark-larter
Copy link

commented Jan 29, 2013

Behavior happens because the current internal _getZIndex function traverses the parent element tree, but returns when the first non-zero zindex value is found, returning a value which may not be the largest zindex among the parents. One condition where it causes the problem is with certain non-jQuery UI dialog containers that use large fixed zindex values and nested zindex-influenced elements of their own.

Admittedly, this may not be a use case that warrants any attention, but just in case, here is a modified version of the _getZIndex function that resolves this issue:

// This is an enhanced copy of the zIndex function of UI core 1.8.?? For backward compatibility.
// Enhancement returns maximum zindex value discovered while traversing parent elements, 
// rather than the first zindex value found. Ensures the timepicker popup will be in front,
// even in funky scenarios like non-jq dialog containers with large fixed zindex values and
// nested zindex-influenced elements of their own.
_getZIndex: function (target) {
    var elem = $(target);
    var maxValue = 0;
    var position, value;
    while (elem.length && elem[0] !== document) {
        position = elem.css("position");
        if (position === "absolute" || position === "relative" || position === "fixed") {
            value = parseInt(elem.css("zIndex"), 10);
            if (!isNaN(value) && value !== 0) {
                if (value > maxValue) { maxValue = value; }
            }
        }
        elem = elem.parent();
    }

    return maxValue;
},
@fgelinas

This comment has been minimized.

Copy link
Owner

commented Jan 30, 2013

Hi Mark,
You are right, the current code did not work correctly with embedded z-index.
Tried the new code here ( http://jsfiddle.net/DRdsE/1/ ) and it works fine.
Commiting the change. Thanks for sharing this fix!

@fgelinas fgelinas closed this Jan 30, 2013
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.