jQuery背景画布透明度

本文介绍了jQuery背景画布透明度的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在使用 jQuery背景画布插件，并创建了带有圆角和渐变效果的DIV.但是，我无法获得透明性.我究竟做错了什么?这是JavaScript:

I'm using the jQuery Background Canvas plugin and have created a DIV with rounded corners and a gradient effect. However, I'm unable to get the transparency to work. What am I doing wrong? Here's the 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); }

元素本身看起来像这样:

The element itself looks like this:

<div class="Test"> something here </div>

这是它的CSS:

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

推荐答案

我遇到了同样的问题. 就我而言，以下代码可以解决问题:

I ran into the same problem. In my case, the following line did the trick:

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