Offset

Posted on Edited on In Views: Disqus:

 

一、.offset()

請參考CSS第十項。

 

二、.offsetParent()

前提是祖先元素有使用CSS position屬性之下，用來取得上一個祖先元素的位置。

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-3.0.0.js"></script>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
</head>
<body>
    <ul class="level-1">
        <li class="item-i">I</li>
        <li class="item-ii" style="position: relative;">
            II
            <ul class="level-2">
                <li class="item-a">A</li>
                <li class="item-b">
                    B
                    <ul class="level-3">
                        <li class="item-1">1</li>
                        <li class="item-2">2</li>
                        <li class="item-3">3</li>
                    </ul>
                </li>
                <li class="item-c">C</li>
            </ul>
        </li>
        <li class="item-iii">III</li>
    </ul>

    <script>
        $("li.item-a").offsetParent().css("background-color", "red");
    </script>
</body>
</html>

 

三、.position()

請參考CSS第十三項。

 

四、.scrollLeft()

請參考CSS第十五項。

 

五、.scrollTop()

請參考CSS第十六項。