Zoom

zoom applies a center-based Ken Burns zoom effect during the element's visible duration. zoom: true uses the default depth of 1.2; pass an object to choose how far the zoom ends.

zoom?: boolean | { depth?: number };

depth is the final scale factor reached at the end of the element's visible window, between 1 and 10 (default 1.2).

zoom is supported for IMAGE, VIDEO, and GIF elements. It is not available on TEXT/HTML elements (use a CSS transform: scale(...) animation through customCode instead) or on the deprecated SVG element.

Example

{
  "type": "IMAGE",
  "src": "https://cdn.example.com/photo.jpg",
  "width": 1280,
  "height": 720,
  "zoom": true
}

With an explicit depth (ends at 1.5× zoom):

{
  "type": "VIDEO",
  "src": "https://cdn.example.com/clip.mp4",
  "resize": "cover",
  "zoom": { "depth": 1.5 }
}

Used By

• Image Elements
• Video Elements
• GIF Elements

zoom: { depth: 1.35 } — the Ken Burns effect