Chapter 14: Layers

Core Idea

Unlike normal websites, a video has fixed dimensions. That means, it is okay to use position: "absolute"!

Key Concepts

• See also

Code Examples

export const MyComp: React.FC = () => {
  return (
    <AbsoluteFill>
      <AbsoluteFill>
        <Img src={staticFile('bg.png')} />
      </AbsoluteFill>
      <AbsoluteFill>
        <h1>This text appears on top of the video!</h1>
      </AbsoluteFill>
    </AbsoluteFill>
  );
};

• What it demonstrates: Usage pattern for Layers from the official docs.

Key Takeaways

1. Understand see also when working with Layers.

Connects To

• Absolute Fill: related page in the Fundamentals & Core Concepts section.
• Animating Properties: related page in the Fundamentals & Core Concepts section.
• Animation Math: related page in the Fundamentals & Core Concepts section.