使用Javascript获取图片坐标以及宽度高度的方法

首先说下获取图片宽度与长度的问题:

<script type="text/javascript">
         function lpimgClick(img,event)
         {
             var x = img.width;
            alert(x);
         }
     </script>
  
     <img id="lpnk" alt="图"src="images/20111122142401700-w.jpg" height="395" width="695"  onclick="lpimgClick(this,event)"/>

使用这种方法可以获得图片的宽度和长度。

获取图片点击事件或者move事件时候鼠标指针的位置:

 <script type="text/javascript">
         function lpimgClick(img,event)
         {
             var x = event.clientX / img.width;//按比例获取 
             $("#txtX").val(x);
             var y = event.clientY;
             $("#txtY").val(y);    
         }
     </script>

网页中的img标签事件跟上面一个一样

  
     <img id="lpnk" alt="图"src="images/20111122142401700-w.jpg" height="395" width="695"  onclick="lpimgClick(this,event)"/>

使用这两个方法可以做个地图标注的功能,当然,这只是最简单的演示。

原文地址:https://www.cnblogs.com/xuhongfei/p/3112670.html