Javascript分區定位

Question

這是我的簡單代碼，它包含除法，該除法可以在屏幕上的任何位置（用鼠標在x軸上）拖動來移動。在第一次拖動時一切都完美，但是在第二次除法時又回到了其原始位置，即屏幕的中心。為什么會發生這種情況，但不知道如何解決。我的觀點是繼續從以前的拖拽移動它的坐標開始移動除法。

<!DOCTYPE html>
 <html>
   <head>
   </head>

<body style="overflow:hidden">
  <style>
   #screen
   {
    width:200px;
    height:300px;
    position:absolute;
    top:0;bottom:0;left:0;right:0;
    margin:auto;
    border-style:solid;
   }
  </style>

  <script>

   var exit=0;

   document.onmousedown=function(e)
   {
    exit=1;
    x=e.pageX;
    document.onmousemove= function(e)
    {
     if(exit==1)
     {
      y=e.pageX;
      final=x-y;
      document.getElementById("screen").innerHTML=final;
      document.getElementById("screen").style.left=final+"px";
     }
    };
   };

   document.onmouseup=function(e)
   {
    exit=0;
   }

  </script>

  <div id="screen">

</body>
</html>

Answer 1

您想要存儲“最終”值，以便可以在下次單擊時將其用作偏移量。 發生的情況是您使用鼠標向下鍵和mousemove X差來移動對象，但是在第二次單擊時，您沒有考慮到對象已被先前的“最終”值偏移，並且必須以該偏移量進行移動心里！ 這是工作的代碼段，以及下面的jsfiddle鏈接：

   var exit=0;
   var final = 0;

   document.onmousedown=function(e)
   {
       exit=1;
       x=e.pageX + final;
       document.onmousemove= function(e)
       {
         if(exit==1)
         {
              y=e.pageX;
              final=x-y;
              document.getElementById("screen").innerHTML=final;
              document.getElementById("screen").style.left=final+"px";
         }
       };
   };

   document.onmouseup=function(e)
   {
       exit=0;
   }

的jsfiddle：

http://jsfiddle.net/dcasadevall/NELWW/

Javascript分區定位

問題描述

1 個解決方案

解決方案1
1 已采納 2014-01-03 19:57:26

Javascript分區定位

問題描述

1 個解決方案

解決方案1 1 已采納 2014-01-03 19:57:26

解決方案1
1 已采納 2014-01-03 19:57:26