如何使用滑动，缩放和裁剪操作jquery中图像的大小或位置？

Question

我想模仿facebook横幅图片上传裁剪功能。 目前，他们允许用户上传横幅，但是在保存之前，他们会上下滑动凸轮，直到显示所需的图像部分。

我想这样做，但也可以从左到右缩放和滑动。 我将轴结果存储在db中，并使用溢出隐藏的css设置将图像的一部分隐藏在横幅div之外。

有一个流行的插件可以做到这一点，它轻巧易用吗？ 还是有一些我可以遵循的教程，以便我自己推广？

亲切的问候

Answer 1

对于任何认为migth有用的人，您都可以使用jQuery Guillotine做到。 它类似于Facebook的方法，并且可以处理缩放和旋转。

检查演示 。

Answer 2

请看下面的链接，这些链接可能对您有用，或者至少给您一些有关如何发挥自己的作用的想法：

• http://www.dimin.net/software/panojs/
• http://codecanyon.net/item/smooth-zoom-pan-jquery-image-viewer/511142?ref=lvraa

我建议一旦用户提交图像，在图像上进行一些服务器端操作。 这样，当您仅需要一小部分图像时，就不会存储/加载非常大的图像。 另外，每次加载图像进行显示时，都不需要逻辑来裁剪/缩放图像。