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

这是因为bgColorjCrop中的默认选项设置为"黑色".

只需bgColor在init中添加选项即可,您的图像将是透明的:

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