Skip to content
Related Articles

Related Articles

HTML | DOM offsetLeft Property
  • Difficulty Level : Easy
  • Last Updated : 26 Jul, 2019

The DOM offsetLeft property is used to returns the left position in pixels. This position is relative to the left side of the offsetParent element.

Syntax:

element.offsetLeft

Return Value: It returns the number representing the left position of the element in pixels.

Example:




<!DOCTYPE html> 
<html
    <head
        <title>
            DOM offsetLeft Property
        </title
          
        <style>
            #GFG {
                height: 50px;
                width: 200px;
                padding: 10px;
                background-color: green;
            }
        </style>
    </head
      
    <body
        <h2>
            DOM Style offsetLeft Property
        </h2>     
               
        <div id = "GFG">
            <b>Information about this div:</b><br>
  
            <p id = "demo"></p>
        </div><br>
          
        <button type = "button" onclick = "geeks()"
            Submit 
        </button
              
        <script
            function geeks() { 
                var testDiv = document.getElementById("GFG");
  
                document.getElementById("demo").innerHTML
                    = "offsetLeft: "+ testDiv.offsetLeft;
            
        </script
    </body
</html>                    

Output:
Before Click on the button:

After Click on the button:

Supported Browsers: The browser supported by DOM offsetLeft property are listed below:

  • Google Chrome
  • Internet Explorer 8.0
  • Firefox
  • Opera
  • Safari

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :