Showing posts with label jQuery position() method. Show all posts
Showing posts with label jQuery position() method. Show all posts

jQuery position() method

The position() method returns the position (relative to its parent element) of the first matched element. This method returns an object with 2 properties; the top and left positions in pixels. So we can say that The .position() method allows us to retrieve the current position of an element

Syntex:


$(selector).position()



Example:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        var x = $("p").position();
        alert("Top position: " + x.top + " Left position: " + x.left);
    });
});
</script>
</head>
<body>

<p>This is a paragraph and we will get the position of this paragraph using position() method.</p>
<button>it will Return the top and left position of the p element</button>

</body>
</html>