JavaScript Tutorial/jQuery/offset
Содержание
Get offset
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ var b = $("b:last"); var offset = b.offset(); alert(offset.left); alert(offset.top); }); </script> </head> <body> <body> Hello asdf asdf </body>
</html></source>
Get top
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ var b = $("b:last"); var offset = b.offset(); alert(offset.left); alert(offset.top); }); </script> </head> <body> <body> Hello asdf asdf </body>
</html></source>
offset(): returned object contains two Integer properties, top and left. (works only with visible elements)
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ var p = $("p:last"); var offset = p.offset(); p.html( "left: " + offset.left + ", top: " + offset.top ); }); </script> </head> <body> <body>
Hello
2nd Paragraph
</body>
</html></source>
Output tag and coordinates
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("*", document.body).click(function (e) { var offset = $(this).offset(); e.stopPropagation(); alert(this.tagName + " coords ( " + offset.left + ", " + offset.top + " )"); });
}); </script> </head> <body> <body> Hello asdf asdf </body>
</html></source>