jQuery背景canvas透明度

我正在使用jQuery Background Canvas插件并创建了一个带圆角和渐变效果的DIV。 但是，我无法获得透明度。 我究竟做错了什么？ 这是JavaScript：

$(document).ready(function() { $(".Test").backgroundCanvas(); $(".Test").makeElementTransparent("#CECFCE"); $(".Test").backgroundCanvas(true, "#CECFCE"); }); function DrawBackground() { $(".Test").backgroundCanvasPaint(TestBackgroundPaintFkt); } // Draw the background on load and resize $(window).load(function () { DrawBackground(); }); $(window).resize(function() { DrawBackground(); }); function TestBackgroundPaintFkt(context, width, height, elementInfo) { var options = {x:0, height: height, width: width, radius:7, border: 0 }; // Draw the red border rectangle context.fillStyle = "#CECFC6"; $.canvasPaint.roundedRect(context,options); // Draw the gradient filled inner rectangle var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 10); backgroundGradient.addColorStop(0 ,'#F7F7EF'); backgroundGradient.addColorStop(1, '#CECFCE'); options.border = 1; context.fillStyle = backgroundGradient; $.canvasPaint.roundedRect(context,options); } 

元素本身如下所示：

 
 something here  

这是它的CSS：

 .Test { width: 300px; height: 300px; } 

Answer 1

我遇到了同样的问题。 在我的情况下，以下行做了诀窍：

 $('#*[canvasId]*').css('background-color','transparent'); 

Answer 2

该解决方案与此jQuery库无关; 它是不透明度/透明度的CSS属性。 对于Firefox和Safari，这可以解决问题：

 .Test { -moz-opacity:0.5; /* For older FF versions */ -khtml-opacity:0.5; opacity:0.5; } 

对于IE，这是必要的：

 canvas.jbgCanvas { filter:alpha(opacity=50); } 

在大多数情况下，您应该能够将filter属性应用于元素; 但在这种情况下，它唯一的工作方式是将它应用于CANVAS对象。