Determine the closest z-index element?

Is there a correct way to determine if the element (any element) closest to the target element has a z-index?

For example, I add a div to the DOM layer and I want to know if there is an element next to this div with a z-index, so I can put this div accordingly so that it does not get lost under the layers, because I don’t know where and when it will be added.

Thanks!

EDIT:

I have a tooltip plugin that adds tooltips to a page dynamically and then saves them on the server. I would post the code, but I'm afraid this will not make much difference to my question.

+4
source share
3 answers

, . , z-

    function getElement($target){
       var $parents = $target.parents();
       for(var i=0;i<$parents.length;i++){
          if($parents[i].css('z-index').length>0){
              return $parents[i];
          }
       }
       return false;

    }
+2

, .

/**
 * Helper to retrieve the z-index which is required to bring up the dragged element in front.
 * @returns {undefined}
 */
getZIndex: function () {
    if (this.z_index === undefined) {

        var recrusive_z_index_search = function(element) {

            // Break on body.
            if (element[0] === $('body')[0]) {
                return 2;
            }

            // Get parent element
            var parent = $(element).parent();

            // Check if parent has z-index
            var z_index = parent.css('z-index');
            if (z_index.length > 0 && !(/\D/).test(z_index)) {

                // Return found z-index.
                return z_index;
            }

            // Z-index not found, try again on next parent.
            return recrusive_z_index_search(parent);
        };

        this.z_index = recrusive_z_index_search($(this.element));

    }
    return this.z_index;
},

. . , z-, , z-index "auto". , .

, .

0

Firefox firebug https://getfirebug.com/ Chrome Developer Tools ( Chrome) inspect the element, z-.

Adding an item next to another is divnot related to the z-index property. z-indexwill cause the element with the highest number in front when objects will overlap. Otherwise, this is not the object you are looking for. Especially if you have not defined any properties z-indexfor other elements.

CSS specifics are what you can search here

-1
source

All Articles