jquery - jcrop 将透明图像变成黑色

Question

我想使用 jcrop 选择一个我无法修改的内置 JavaScript 的区域。我认为这个 javascript 干扰了 jcrop 。所以我尝试将一个透明的 gif 放在我想要选择的东西的顶部。这阻止了下面的东西干扰 jcrop，我可以很好地选择区域。然而，Jcrop 使透明图像变成黑色而不是透明。

这是一个jsfiddle http://jsfiddle.net/andieje/rvTmX/

这是html

         <img id="cropbox" src="http://deepliquid.com/projects/Jcrop/demos/demo_files/sago.jpg" style="position: absolute; left: 0px: right: 0px;" />
<img id="transparent" src="http://www.golivetutor.com/download/spacer.gif" style="width: 100px; height: 100px;position: absolute; left: 0px: right: 0px;"/>

这只是显示了链接到 jcrop 的透明图像以及它如何变成黑色。

有什么办法可以解决这个问题吗？我不太了解 css，但我不介意修改是否意味着图像的未选定区域不再变灰 - 我只想要选定位周围的有界矩形。

非常感谢您提供的任何帮助

Answer 1

这是因为 jCrop 中 bgColor 的默认选项设置为“黑色”。

只需在 init 中将 bgColor 选项添加为空，您的图像就会透明:

 $('#transparent').Jcrop({
    onChange: showCoords,
    bgColor: ''
},function(){
    jcrop_api = this;
});