Home/ Questions/Q 9172491
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T16:21:32+00:00

I am trying out the following code: <!DOCTYPE html> <html> <head> <script src=//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js> </script>

  • 0

I am trying out the following code:

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("span").click(function(){
    alert($(this).offsetParent().length);
  });
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p><span>Click me away!</span></p>
<p>Click me too!</p>
</body>
</html>

From the jQuery documentation, offsetParent() is supposed to return the closest positioned parent, positioned meaning one with position defined explicitly as ‘static,absoluteorrelative`. here, none is declared for any element, yet the alert pops up 1. How come?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    First, let as look at the return result:

    [html, prevObject: jQuery.fn.jQuery.init[1], context: span, jquery: "1.9.0", constructor: function, init: function…]

    So for $(span).offsetParent() you get the HTML element.

    Now let’s look at the implementation of offsetParent:

    offsetParent: function() {
    return this.map(function() {
        var offsetParent = this.offsetParent || document.documentElement;
        while ( offsetParent && ( !jQuery.nodeName( offsetParent, "html" ) && jQuery.css( offsetParent, "position") === "static" ) ) {
            offsetParent = offsetParent.offsetParent;
        }
        return offsetParent || document.documentElement;
    });
}

    From the code above we see that if we don’t have positioned parent offsetParent returns the HTML element.

    The only bad things is that when I looked at the documentation that wasn’t there.

    To check whether there’s actually an offsetParent you can use:

    document.getElementsByTagName('html')[0] === $(elem).offsetParent()[0]

    • 0