Firefox 18 奇怪的画布背景行为答案

【问题标题】：Firefox 18 wierd canvas background behaviourFirefox 18 奇怪的画布背景行为
【发布时间】：2013-01-07 16:40:26
【问题描述】：

在我升级到 Firefox 18 之前，以下内容一直有效，现在它正在更改大部分页面，使其具有黑色背景。如果我删除了边框半径、溢出：隐藏或 button_body 上的背景，它似乎可以解决问题。

调整浏览器的大小似乎也会产生随机结果，如果我让窗口足够小，它会使窗口背景和浏览器背景本身透明，这样我就可以看到桌面。

是否有什么我做错了，或者我可以更改以仍然保留我的所有 CSS 样式但消除此问题？

<html>
<style>
    body, div, p, canvas {
        overflow: hidden;
    }
    #Main2 {
        left: 0;
        position: absolute;
        top: 0;
        z-index: 1;
        width:500px;
        height:300px;
    }
    #pDiv div.button_body {
        background: #396B9E;
    }
    #pDiv{
        position:absolute; 
        left: 100px; 
        top: 20px; 
        width: 136px; 
        height: 16px; 
        border-radius: 0.3em 0.3em 0.3em 0.3em;
        z-index:10;
    }             
</style>
<body>
<canvas  id="Main2">Upgrade your Browser!</canvas>
<div id="pDiv">
    <div class="button_body">
        test
    </div>
</div>
</body>
<script>
        var _o = document.getElementById('Main2').getContext('2d');
        _o.fillStyle = 'rgba(208, 208, 208, 1)';
        _o.fillRect (0, 8, 200, 200);      
</script>

这是一个示例页面。 http://crystalvalleycomputers.com/test/test.html

【问题讨论】：

标签： html css firefox canvas

【解决方案1】：

问题在于画布填充样式。

更正的代码：

 _o.fillStyle = 'rgba(208, 208, 208, 1)';

【讨论】：

感谢指正。我在这里输入时错过了那个错字。但是除了使画布变灰之外，我没有看到任何修复，页面的其余部分仍然是黑色的，并且调整窗口大小仍然会对背景的其余部分产生影响。
检查这个jsfiddle：jsfiddle.net/NyBWc。我也在使用firefox18.0.1，但它没有显示你所说的。
是的，无论出于何种原因，它都不会在 jsfiddle 上发生，也许 iframe 会阻止它发生？但是，如果您在其自己的窗口中查看输出，那么它会。 fiddle.jshell.net/NyBWc/show