拖动背景图像

Question

我正在尝试为游戏开发地图。 整个地图是一个 6000 像素 x 6000 像素的图像。该地图也显示为 6000px x 6000px 的 div（容器）的背景。 我的问题是让我的地图可拖动的最简单方法是什么，因此您可以单击屏幕中间并拖动到两侧。

地图本身（div 容器）不应该改变位置，因为我打算用 POI 填充它。 我不需要任何有趣的工作人员，例如缩放等，只是用户不需要使用网页中的滑块进行导航，只需单击地图并左/右/上/下拖动即可移动。

对不起，如果以前回答过这个问题，我找不到答案。

Answer 1

这是一个最小的例子，它允许在 div 中拖动图像

<div id="container">
    <img id="draggable" src="http://lorempixel.com/800/800" />
</div>

#container {
    width: 400px;
    height: 400px;
    overflow: hidden;
}

$('#draggable').draggable();

查看全文JSFiddle