为什么不在Firefox上创建RadialGradient？

Question

我正在使用HTML5和JavaScript的画布标记来访问画布方法和属性。

此代码适用于Chrome，但不适用于Firefox：http://jsfiddle.net/thirtydot/BD3xA/。

有谁知道为什么？

Answer 1

createRadialGradient适用于Firefox，但addColorStop无法完全工作 - 并且如果您将透明度和颜色一起传递，将会引发异常。

例如，创建后径向渐变：

var grad = ctx.createRadialGradient(centerX,centerY,outRadius,centerX,centerY,outRadius+pad); 
var colorOut="rgba(100,200,100,0.7)"; 
grad.addColorStop(0,'rgba(0,0,0,0)'); 
grad.addColorStop(0.01,colorOut); 

上述适用于Chrome很大，但将不会因为在RGBA颜色的0.7 FF工作。

所以，我用的是这样的：

colorOut= ($.browser.mozilla)?'#D88':'rgba(200,100,100,0.7);'; 

这没有梯度看起来相当这么好看的FF，但功能。

当然，您应该先缓存$ .browser.mozilla - 创建一个var IS_MOZILLA = $ .browser.mozilla;然后使用它（这样可以最大限度地减少类调用......因为在复杂的绘图调用中保存每个计算都很重要）。