Forums » Help » Transparent backgrounds

I'm trying to add an animated background to my game. Do You guys know how can i make the background transparent?

Use PNG with alpha transparency as a sprite sheet and place the background as a large sprite? would that work?

You can use transparent PNGs for BackgroundMaps as well. Tiles in BackgroundMaps can also be animated. See the animations article.

My background layer is using transparecy, but behind it is always black. 1) How can I change it from black? 2) Can I make it so my html or body element backgrounds show through the transparency? Will that slow things down?

I'm looking all over the place at my css, and it doesn't look like that is affecting anything, so I'm not sure where these settings would be.

Set the Game's .clearColor to null and instead clear the canvas with the Canvas API's .clearRect() before drawing anything else. I.e. in your Game's draw():

draw: function() {
	ig.system.context.clearRect( 0 ,0, ig.system.realWidth, ig.system.realHeight );
	this.parent();
}

This will make the Canvas completely transparent, so that DOM elements behind it will be visible. Depending on the browser, this may have a performance hit, but I don't think it's a big one.

That works. Thanks!

dominic beat me to it but that's what I've been doing. :0