sprite.depth

Depth of the sprite in the drawing order.

Sprites are drawn, when drawSprites() is executed, in order from lowest depth to highest depth. The sprites drawn later will overlay sprites drawn earlier.

If you assign a sprite to a depth that is already the depth of another sprite, that other sprite, and all other larger depth sprites, have their depths increased by one.

Examples

Create a flickering box by swapping sprite depths.

// Create a flickering box by swapping sprite depths.
var sprite1 = createSprite(200, 200);
var sprite2 = createSprite(200, 200);
sprite2.shapeColor="black";
function draw() {
  background("white");
  drawSprites();
  var temp=sprite1.depth;
  sprite1.depth=sprite2.depth;
  sprite2.depth=temp;
}

Syntax

sprite.depth

Returns

The depth of the sprite.

Tips

• Sprites all have the same properties and you use the dot notation (combining the name of the sprite, followed by a dot, with the label of the property) to both access and update the property for that sprite.
• Any changes to the properties of a sprite will not be seen until after drawSprites() is called.

Found a bug in the documentation? Let us know at documentation@code.org