-2

我正在做一些需要以下内容的事情：

  • 有一个带有特定页眉和页脚的图像，用作一种模板/背景
  • 用户需要能够上传图像、裁剪图像并将其拖到模板上，并在理想情况下定位它
  • 新图像被保存

你们中是否有人碰巧知道一两个可以实现此功能的插件？我有一些使用 jCrop 的东西，但是我自己完成了图像合并的东西，它不是很好。我更喜欢更强大的东西，所以最好有一个独立的插件。

谢谢

4

1 回答 1

0

您可以使用 HTML5 Canvases 实现类似的效果，但它并不优雅，而且显然不适用于每个浏览器。

这个想法是简单地将这些图像绘制到画布上，然后将img对象设置为画布的源

要将画布绘制保存为图像，我们可以将图像对象的来源设置为图像数据 URL。从那里，用户可以右键单击图像以将其保存到本地计算机。或者，您也可以直接打开一个带有图像数据 url 的新浏览器窗口，用户可以从那里保存它。

// save canvas image as data url (png format by default)
var dataURL = canvas.toDataURL();

// set canvasImg image src to dataURL
// so it can be saved as an image
document.getElementById("canvasImg").src = dataURL;

在此处查看完整教程

于 2012-08-14T15:11:07.890 回答