Below is code snippet
And output is below:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery Position of Element</title> <script src="jquery-2.1.4.js"></script> <script type="text/javascript"> $(document.body).ready(function() { var body = $(document.body), element = body.find(".element"), log = body.find(".log"); var rect = element[0].getBoundingClientRect(); log.append("<p>LEFT==" + rect.left + "</p>"); log.append("<p>TOP==" + rect.top + "</p>"); log.append("<p>RIGHT==" + rect.right + "</p>"); log.append("<p>BOTTOM==" + rect.bottom + "</p>"); log.append("<p>WIDTH==" + rect.width + "</p>"); log.append("<p>HEIGHT==" + rect.height + "</p>"); }); </script> </head> <body style="margin:0"> <div style="position:relative;width:100%;height:100%;margin:0"> <div class="element" style="position:absolute;margin:0;left:170px;top:200px;border:1px solid red;width:100px;height:30px;"></div> </div> <div class="log" style="font-weight:bold;"></div> </body> </html>
And output is below:
No comments:
Post a Comment