Question

我有一个我想用鼠标移动的元素。

<div id="troll">
  <img src="http://images.mmorpg.com/features/7909/images/Troll.png" alt="Troll">
</div>

mapView.projection.point

didChange position

从左到右，从上到下，它可以正常工作。不完美，因为第一次移动需要整个空间而且看起来不平滑。但主要问题是我不能从右到左或从下到上移动。

任何帮助都将不胜感激。

Answer 1

你想使用拖动而不是dragover，以及一些逻辑来知道你上下或左上或上下的位置。

＆＃13;

var troll = document.getElementById('troll');

var X,Y = 0;

troll.addEventListener('drag', (e) => {
  e.preventDefault();
 
  if (e.clientX > X) 
  {
    e.target.style.left = X + 'px'; 
  }
  else if (e.clientX < X) 
  {
    e.target.style.left = X-- + 'px'; 
  }
 

  if (e.clientY > Y) 
  {
    e.target.style.top = Y + 'px'; 
  }
  else if (e.clientY < Y) 
  {
    e.target.style.top = Y-- + 'px'; 
  }


  
  X = e.clientX;
  Y = e.clientY;
  
 
}, false);

＆＃13;

img {
  width: 100px;
  cursor: pointer;
  position: absolute;
}

＆＃13;

<div id="troll">
  <img src="http://images.mmorpg.com/features/7909/images/Troll.png" alt="Troll">
</div>

＆＃13;

Dragover：无法移动到左侧和顶部

1 个答案: