HTML DOM offsetTop Property

HTML DOM Style animationDuration Property

HTML DOM Style animationIterationCount Property

The DOM offsetTop property is used to return the top position which is relative to the top of the offsetParent element.

Syntax:

object.offsetTop

Return Value: A number in the pixel unit represents the top position of the element.

Example: In this example, we will use DOM offsetTop property

HTML

<!DOCTYPE html>
<html>
<head>
    <style>
        #offsetdiv {
            top: 80px;
            margin: 20px;
            padding: 10px;
            width: 350px;
            position: absolute;
            border: 5px solid green
        }
    </style>
</head>
<body>
    <h3>Beginner for Beginner</h3>
    <h3>HTML DOM offsetTop property</h3>
    <div id="offsetdiv">
        <p>
            <button onclick="GFGfunction()">Try it</button>
        </p>
        <p>offsetTop is: <span id="gfg"></span></p>
    </div>
    <script>
        function GFGfunction() {
            let x = document.getElementById("offsetdiv");
            document.getElementById("gfg").innerHTML =
                offsetdiv.offsetTop;
        }
    </script>
</body>
</html>

Output:

Supported Browsers:

Google Chrome 1 and above
Edge 12 and above
Internet Explorer 5.5 and above
Firefox 1 and above
Opera 8 and above
Safari 3 and above

Tags:

#Technical Scripter 2018 #Technical Scripter #Web Technologies

HTML DOM Style animationDuration Property

HTML DOM Style animationIterationCount Property

HTML DOM offsetTop Property

HTML

Contact Us