cropper.js 遇到问题

Posted 2023-02-25

【中文标题】cropper.js 遇到问题

【英文标题】：Having trouble with cropper.js

【发布时间】：2016-06-30 10:59:46

【问题描述】：

我在我正在做的事情上使用cropper.js，但是在让它正常工作时遇到了一点麻烦，是否有可能看到我可能做错了什么。

网页上的图像“重复”。 （此处以随机图像为例）

我的 html，图片：

<img id="ImageFrame" src="http://www.availstaffing.com/wp-content/uploads/2010/07/Temporary-Button.jpg" style="max-width:100%" />

我的javascript：

$(function () 
                var image = $('#ImageFrame');
                var cropImage = new Cropper(image[0], 
                    preview: 'div#CropPreview',
                    built: function () ,
                    crop: function (e) 
                        $("#cropX").val(Math.round(e.detail.x).toString());
                        $("#cropY").val(Math.round(e.detail.y).toString());
                        $("#cropH").val(Math.round(e.detail.height).toString());
                        $("#cropW").val(Math.round(e.detail.width).toString());
                    
                );
            );

那么结果：

欢迎任何帮助。

【问题讨论】：

尝试使用：background-repeat: no-repeat;

我发现了问题。我忘了在页面中添加cropper.css。

您好，请您说说什么是#cropX,#cropY,#cropW,#cropH

它们是隐藏输入<input type="hidden" id="cropX" />

【参考方案1】：

尝试将 cropper.css 包含到您的文件中