6

我想使用 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，但如果修改意味着图像的未选择区域不再变灰，我不会感到困扰——我只想要选定位周围的有界矩形。

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

4

2 回答 2

11

That is because the default option for bgColor in jCrop is set to 'black'.

Just add the option for bgColor in your init to be nothing and your image will be transparent:

 $('#transparent').Jcrop({
    onChange: showCoords,
    bgColor: ''
},function(){
    jcrop_api = this;
});
于 2013-08-19T17:33:31.807 回答
0

Here is the solution (link). I changed the image to a div with transparent color by using rgba(0,0,0,0). Let me know if this is what you are trying to achieve.

<div id="transparent" style="width: 100px; height: 100px;position: absolute; left: 0px: right: 0px; background: rgba(0,0,0,0);"/>

于 2013-08-19T17:33:17.417 回答