如何使元素100％宽度和高度（页面（文档））而不仅仅是窗口（浏览器）？

Question

我有一段代码，它有一个轻微的闪烁动画，我想用作背景但当前它只填充浏览器窗口，我希望它填满整个页面/文档。

有人可以帮忙吗？ JSFiddle在这里 - https://jsfiddle.net/83aahcng/1/

<div id="container">
  <canvas id="pixie"></canvas>
  <div class="content">
    <p>This is some content</p>
  </div>
</div>

Answer 1

更改您的setDimensions，如下所示：

    function setDimensions(e) {   
 var body = document.body,
    html = document.documentElement;
            WIDTH = window.innerWidth;
            HEIGHT =  Math.max( body.scrollHeight, body.offsetHeight, 
                       html.clientHeight, html.scrollHeight, html.offsetHeight );
            container.style.width = WIDTH+'px';
            container.style.height = HEIGHT+'px';
            canvas.width = WIDTH;
            canvas.height = HEIGHT;
        }

https://jsfiddle.net/83aahcng/2/