jquery get the document element coordinate values

  <!DOCTYPE html>
  <html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  /**{
  margin: 0;
  padding: 0;
  }*/
  div{
  width: 800px;
  height: 800px;
  border:1px solid #eee;
  position: relative;
  margin: 50px;
  }
  img{
  position: absolute;
  top: 50px;
  left: 80px;
  }
   
  </style>
  <script src='js/jquery-1.11.3.min.js'></script>
  <script>
  $(function(){
  $('button:eq(0)').click(function(){
  alert($('.box').offset().top + ',' + $('.box').offset().left);
  })
  $('button:eq(1)').click(function(){
  alert($('img').position().top+ ',' + $('img').position().left);
  })
  })
  </script>
  </head>
  <body>
  <button>获取div的文档坐标值</button>
  <button>获取图片相对于定位点的坐标值</button>
  <div class='box'><img src="images/lunbo/0.jpg" alt=""></div>
  </body>
  </html>

Guess you like

Origin www.cnblogs.com/zykzyk/p/11390814.html