没有fancybox，Jcrop 运行良好。但是如果我在 Fancybox 中加载 Jcrop，我将无法裁剪图像。

图像在浏览器中显示两次。我想这应该是一个CSS问题或什么的。

有什么解决办法吗？

我正在使用 Jquery 表单插件。

弹出窗口与图像上传表单一起显示。图片上传成功。我想在成功上传图片后关闭弹出窗口。下面的 javascript 是用弹出内容编写的。

但它不起作用。Jquery 库，fancybox 库包含在弹出内容和父页面中。

另外，我想用加载的“dd（ajax 返回值）”内容再次重新加载fancybox。它将具有 Jcrop 功能。

现在，一旦 ajaxSubmit 用于上传图像，Jcrop 就无法正常工作。否则它正在工作

编辑我重命名了 page1 page2 和 page3 以更好地理解 index.html

上传.php

test.php 包含（我只是用静态图像测试。这里没有写上传脚本。）

Jcrop 不适用于此方法。如果我跳过upload.php 步骤，jcrop 在fancybox 中工作正常。所以我需要在上传后删除并创建一个新的fancybox！

编辑结束

html源代码：

这很奇怪。我在加载图像时调用jCrop函数，我确信jCrop可以得到图像的真实宽度和高度，但结果是图像失真。

有没有人遇到这个错误？

我需要 jcrop 预览方面的帮助。我正在关注railscasts #182 中的本教程，但是出了点问题，我似乎可以弄清楚。这有点难以解释，但裁剪预览不起作用，裁剪调整大小手柄内出现第二张图像。这个额外的图像会随着裁剪的大小而拉伸和倾斜。由于这有点令人困惑，而且我的应用程序仍在我的本地计算机上，因此我包含了当前功能的视频演示 以及我认为下面的所有相关代码。

我还向 jcrop 发送了一封电子邮件，他们建议这可能是由于我的预览区域中的错误引起的。我认为这是正确的，因为我目前使用的是 Ryan Bates 的 railscasts tut 提供的。我认为可能是问题的唯一另一件事是“attr_accessible”和“attr_accessor”。我是 ruby​​ 和 rails 的新手，所以我很难理解我的错误。任何帮助将不胜感激，如果我能提供任何进一步的信息，请告诉我。

首先是我的 avatar_uploader.rb

用户.rb

作物.html.erb

users.js.coffee

如何动态更改 JCrop 的 aspectRatio？

很抱歉这个简单的问题，但所有的手册、文档和讨论都在http://deepliquid.com上，昨天已经死了，我真的需要在今晚完成一些事情。

如果有人有任何机会保存 JCrop 手册，您可以上传吗？

我试图弄清楚我的代码是否有问题或当前的 HTML5 文件 API 实现。

下面的代码有效。在已经加载一次图像后重复该过程时会出现该错误。

第二次选择文件时，图像 blob 加载，然后闪烁并且图像消失。之后的后续选择通常可以正常工作（如果文件很大，有时会出现不稳定的行为）。为相同的文件选择重复该过程通常有效（作为修复）。

任何帮助将不胜感激。

使用的 JavaScript 库

• jQuery 1.7.1

• jQuery 工具 1.2.6

• JCrop 0.9.9

步骤 - 总结

1. <input type="file" /> 用户通过传统对话框选择文件。

2. 为输入执行 onchange 处理程序并检查是否选择了文件，如果是，则验证 MIME 类型是 image/jpeg 或 image/png 并且所选文件大小小于 250KB。如果此验证失败，它将重置选择。

3. 此时要上传的文件（图片）有效。接下来，它检查浏览器是否支持 File API CreateObjectURL via if (typeof window.URL == 'undefined') return;（如果不支持，则跳过后续步骤）

4. 它将图像 blob 加载到当前图片预览（用于显示当前图像）和动态生成的图像元素中，该元素被添加到带有 jcrop 裁剪功能的 jquery 工具的叠加层中。

5. 然后用户通过 jcrop 裁剪图像并关闭叠加层，看到要上传的图像的裁剪预览（仅当浏览器支持 CreateObjectURL 并且用户裁剪图像时）

编码

的HTML

JavaScript window.URL = window.URL || 窗口.webkitURL;

随意使用代码（我对这里收到的任何帮助的贡献）。

更新

我在 stackoverflow 上遇到了另一个关于使用 JCrop 的类似问题（图像加载然后消失）的问题。我目前押注 JCrop 是罪魁祸首。

我还读到，当 img.onload 执行图像时，图像并不总是“准备好”，因此奇怪的行为和使用 setTimeout 对 .actualWidth/.actualHeight 进行的额外检查可能会解决问题。我会调查的。

更新

我有一个使用 FileReader 和 readAsDataUrl 而不是使用 CreateObjectURL 和使用 CANVAS 绘制预览而不是基于边距的溢出的工作概念证明：隐藏解决方案。需要一些改进，然后我会在这里发布代码。

有人知道正确使用“CSS 图像大小（我的意思是宽度和高度）的动态变化”的图像裁剪吗？

如果有原始图像大小（例如大小：400px x 400px）和宽度：100%，则所有图像裁剪都可以正常工作；

但是，如果向用户显示尺寸为 1500 像素 x 1500 像素的图片并仅使用 css 将其缩小为 100 像素 x 100 像素（因为 1500 像素 - 通常对于屏幕来说太大而且看起来不漂亮） - 在这种情况下，我之前看到的图像裁剪器会发出错误或制作带有初始值的缩略图（左上角）。我需要从 Facebook 相册中提取图片，而且通常它们都太大了。

我知道可以在裁剪前缩小图像，但会降低质量。

顺便说一句，看起来有办法做到这一点，因为即使我在 css 中“动态”更改图像的大小，在 jCrop 预览缩略图中看起来也很好。只是预览！完成裁剪的图像不正确，因为我说图像的左上角会有。

这不是一个问题，只是在尝试让这个自己工作之后的一个提示。也许人们已经知道了，但我没有找到它的文档（在 Jcrop 网站或其他地方）。

这实际上只是一个未记录的功能，查看 Jcrop 的源代码，我注意到它在设置之后接受了一个函数作为第二个参数，该函数在 Jcrop 完成加载后被调用。因此，只需在此处输入您的功能即可！

注意：在这种情况下，设置对象不是可选的。回调仅用作第二个参数。你可以发送一个空的设置对象 { } 并且它工作得很好，但是为什么你需要一个这样一个简单的 Jcrop 函数的回调是我无法理解的......

快乐编码！

是否存在在 CKFinder 2 对话框中使用 jQuery 和 jQuery 插件的方法？我只想使用 Jcrop 来用我的插件裁剪图像。例如下面的代码不起作用。jQuery(document).ready(...)事件触发良好，但在其中我无法选择对话框的任何元素。那么，有可能吗？

我想知道您向我推荐了哪些 up-and-crop 工具。我尝试了几个像 JCrop 这样的脚本，但我总是得到某种格式的堆栈，比如 bmp。我要么无法上传，要么可以上传但无法裁剪。如果您使用（或知道）一种适用于不同格式的产品，那么请告诉我它的名称，我们将不胜感激！