单击时跟踪位置

问题描述

| 如何跟踪以百分比表示的元素中单击的位置？基本上，它是用于滑块的...并且一旦单击滑块，我想跟踪针的移动位置（以％表示CSSin0ѭ属性）。

解决方法

尝试这个：

<html>
<head>
<script type=\"text/javascript\" src=\"jquery.js\"></script>
<script type=\"text/javascript\">
jQuery(document).ready(function(){
   $(\"#special\").click(function(e){
      var xP = e.pageX * 100 / $(e.target).width();
      var yP = e.pageY * 100 / $(e.target).height();
      $(\'#status2\').html(xP +\',\'+ yP);
   }); 
})
</script>
<body>

<h2 id=\"status2\">
0,0
</h2>
<div style=\"width: 100px; height: 100px; background:#ccc;\" id=\"special\">
Click me anywhere!
</div>
</body>
</html>

, 设法做到这一点：

$(\'#song-seeker\').click(function(e){
    var offset = $(this).offset(); // somehow this.offsetLeft didn\'t work
    var x = Math.floor(e.pageX - offset.left); // calculates pixel value of position clicked within element
    x = Math.floor(x * 100 / $(this).width()); // transform to % value based on full clicked elements width
    // Math.floor() used to prepare values with 0 values behind comma,therefore,CSS safe.
});

位置位置单击跟踪跟踪