js原生元素拖拽案例
下面是一个简单的使用原生 JavaScript 实现元素拖拽的代码示例：
<!DOCTYPE html>
<html>
<head>
<style>
.draggable {
width: 100px;
height: 100px;
background-color: red;
position: absolute;
cursor: move;
}
</style>
</head>
<body>
<div class="draggable"></div>
<script>
window.onload = function() {
var draggable = document.querySelector('.draggable');
var isDragging = false;
var offsetX = 0;
var offsetY = 0;
draggable.addEventListener('mousedown', function(event) {
isDragging = true;
offsetX = event.clientX - draggable.offsetLeft;
offsetY = event.clientY - draggable.offsetTop;
});
document.addEventListener('mousemove', function(event) {
if (isDragging) {
draggable.style.left =
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
