我有一个非常基本的Croppie div被初始化如下:
HTML:
<div id="upload-avatar" class="croppie-container"></div>
JavaScript的:
$uploadCrop = $('#upload-avatar').croppie({
viewport: {
width: 100,
height: 100,
type: 'square'
},
url: 'test_img.jpg'
});
$('#upload-avatar').croppie('bind');
'test_img.jpg'成功加载到croppie容器中,然而Croppie正在为图像添加“缩放”样式,手动将图像缩放4倍。
scale(4.1667);
'test_img / jpg'已足够小(212px x 248px),可在100px x 100px视口窗口中移动以进行裁剪,因此我不希望图像放大。即使在Croppie网站上复制代码示例后也是如此,我还有同样的问题。任何想法为什么Croppie在我不想要的时候放大我的图像? (见图)
为了实现这一点,我需要上传我想要放在100px x 100px帧中的4X图像,这很荒谬。如果您需要更多信息,请告诉我。
谢谢!
Croppie docs:http://foliotek.github.io/Croppie/#documentation
我想我明白了。在评论出“绑定”调用之后,它的行为与我期望的一样。奇怪..
$('#upload-avatar').croppie({
viewport: {
width: 100,
height: 100,
type: 'square'
},
url: json.file
});
//$('#upload-avatar').croppie('bind'); //Commenting this line, fixed it!