<script>
// 获取图片和容器元素
var img = document.getElementById('draggable');
var container = document.getElementById('container');
var dragging = false;
var offsetX, offsetY;
// 鼠标按下事件
img.addEventListener('mousedown', function(e) {
dragging = true;
offsetX = e.clientX - img.offsetLeft;
offsetY = e.clientY - img.offsetTop;
});
// 鼠标移动事件
container.addEventListener('mousemove', function(e) {
if (dragging) {
img.style.left = (e.clientX - offsetX) + 'px';
img.style.top = (e.clientY - offsetY) + 'px';
}
});
// 鼠标抬起事件
container.addEventListener('mouseup', function() {
dragging = false;
});
// 阻止默认的图片拖动行为
img.addEventListener('dragstart', function(event) {
event.preventDefault();
});
</script>