Using canvas animation as background

I've made a flipping animation that I want to use for background of my website. I've set the canvas size to 1280*800 and saved it as a webpage. I tried to use an iframe and let the b开发者_运维问答rowser scale it to fit (100%;100%), but it's not working very well. Since the body is set to 950px and auto margin, the iframe will only align to as left as the left side of the body, and the iframe did not scale with zooming in/out.

Is there a better way to do this than using iframes? Php or js?

The reason I've saved the animation as a separate webpage is because I felt I made it have too many lines (~1100), there are basically 20 or so of the same flipping animation, and I didn't know a better way other than just to do them individually and use style to place them around.

If I am understanding your questions correctly, you'll want to add the canvas element to a div layer that has #canvasDiv { position:fixed; top:0px; left:0px; z-index:1; } and give everything else a z-index of 2 or greater.

Checkout http://paulirish.com/ to check out a great code example of how to do it.