畫布動畫作為div背景-EaselJS

Question

首先，對不起我的英語不好^^

我正在我的網站上工作，我想將我的canvas動畫（使用easylJS框架創建）放在div背景中。

我嘗試過這樣的事情：

.canvas-bg {
    background: -webkit-canvas(animation);
 }

var ctx = document.getCSSCanvasContext('2d', 'animation', 300, 300);

它可以在safari上工作（但是刷新頁面時動畫會暫停），而在chrome上根本無法工作...

那么，您有什么辦法制作動畫畫布作為div背景？ 例如，例如本網站的藍色標語： http : //www.createjs.com/easeljs

非常感謝 ！
朱利安

Answer 1

您可以將畫布包含在DIV中，然后將其位置設置為絕對位置。 DIV中的其他內容將位於頂部。

#canvas {
  position: absolute;
  display: inline;
}

這是一個快速示例： http : //jsfiddle.net/obcv1rex/1/

您可以將文本添加到第一個DIV中以使其滾動。 我將尺寸設置為1000x1000，但要使其更具動態性，您需要使用JavaScript調整畫布的尺寸（使用CSS可以縮放內容）。