0

我一直在谷歌搜索，但找不到我要找的东西。我真的不知道这会叫什么，所以我会尽力描述它。我正在寻找一种在各种图像编辑器中模拟“手动工具”的方法。我想在 500x500 的 div 中居中放置一个大图像（比如 1024x1024）。然后，用户可以使用手动工具“抓取”图像并在其周围滚动（想想谷歌地图，但只有一张大图像）。有谁知道可以帮助我的教程或插件。

4

1 回答 1

2

您可以使用的提示：

  1. 外部DIV或视口需要具有position: relative;和overflow: hidden;

  2. 内部IMG（你想用鼠标拖动和移动的那个）需要有position: absolute;

  3. 移动/平移逻辑如下：

    • 当用户在您的 IMG 上按下鼠标时 - 设置一个指示移动正在进行的标志

    • 当用户将鼠标移到文档上时 - 如果设置了移动标志，则根据从接收到的事件对象获得的 x 和 y 坐标更新 IMG 的位置（通过更改 is style.left 和 style.top 属性）在回调中

    • 当用户按下或离开鼠标按钮时 - 将移动标志设置为 false

这是一个非常有问题的小提琴，您可以作为开始使用：http : //jsfiddle.net/SPXmB/1/

于 2012-10-01T17:51:35.157 回答