<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="drag" style="width: 100px ;height:100px;position:absolute;left:10px;top:10px;background:pink">
</div>
<script>
window.onload = function() {
var oDrag = document.querySelector(".drag");
// var offsetLeft = oDrag.offsetLeft;
// var offsetTop = oDrag.offsetTop;
var dx = 0;
var dy = 0;
oDrag.addEventListener("mousedown", function(e) {
var offsetLeft = oDrag.offs
js 实现简单拖拽
最新推荐文章于 2024-07-21 13:38:37 发布
本文介绍了如何使用JavaScript实现简单的拖拽功能。主要步骤包括在down事件中计算位移dx和dy,在move事件中更新元素的left和top值,以及在up事件中清理相关操作。虽然存在一些不足,但可以通过查阅并修改他人代码(如CSDN资源)来完善。
摘要由CSDN通过智能技术生成