开启辅助访问
帐号登录 |立即注册

JS写拖拽元素代码的事件过程怎么写?

 
拖拽操作,主要经历三个事件,鼠标按下,移动鼠标,放开鼠标,所以我们代码应该这样写:

// (1) 当我们鼠标按下,
就获得鼠标在盒子内的坐标
title . addEventL istener( ' mousedown',function(e) {
var x = e.pageX - login.offsetLeft;
var y = e.pageY - login.offsetTop;

// (2) 鼠标移动的时候,把鼠标在页面中的坐标,减去鼠标在盒子内的坐标
document . addEventListener( ' mousemove',move )
function move(e) {
login.style.left = e.pagex - x + 'px';
login.style.top = e.pageY - y + 'px';
}

// (3) 鼠标弹起,就让鼠标移动事件移除
document . addEventListener( ' mouseup , function() {
document . removeEventListener( ' mousemove',move) ;
})

回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

友情链接
  • 艾Q网

    提供设计文章,教程和分享聚合信息与导航工具,最新音乐,动漫,游戏资讯的网站。