javascript - 我正在使用 camanJS 对照片应用滤镜。目前遇到应用滤镜裁剪照片的问题

Question

Link to fiddle

每当我在没有 Javascript 代码的情况下运行该程序时，图像加载效果非常好，没有裁剪效果。但是，当我使用 Javascript 代码运行该程序时，图像会被裁剪。

HTML

<img src="my data:image" id= "hello" height = "208" width = "264">

卡曼代码

var vintage = $('#vintagebtn');
Caman("#hello", function () {
 this.vintage();
 this.render();
});

Answer 1

而不是使用 <img> 设置图片的尺寸标签width="264"和height="208" ，使用 CSS 设置宽度和高度。

CSS

#hello {
  width: 264px;
  height: 208px;
}

结果

JSFiddle