Skip to content

container element

Positioned box holding child elements in its own %-coordinate space.

Fields

Field Type Default Description
container list of ImageElement | ImageSequenceElement | HtmlElement | IframeElement | MarkdownElement | MermaidElement | ContainerElement | TemplateElement required The child elements, rendered in array order (first = bottom, last = top) within the container's stacking context. Child position / width / height percentages are relative to the container's box. Authored inline or via container_file: "path/to/children.json" (a JSON5 array of elements).
container_file path (optional) null Path to a JSON5 file containing the child-element array, relative to the file it appears in. Parsed and inlined at parse time. Author exactly one of container / container_file; validated slides always carry container.
template_origin string (optional) null Provenance marker set by template expansion (the template file path, or "") when this container came from a template element. Surfaced by scrolly introspect elements; not meant to be authored.

Every element also shares the common fields — position, size, anchor, opacity, scale, and angle.

Example

{
  // Children position against the container's box; the box defaults to
  // the full slide, so wrapping existing elements changes nothing.
  container: [
    { html: "<div style=\"width:100%;height:100%;background:#5EB083\"></div>", position: [0, 0], width: 100, height: 100 },
    { markdown: "## Grouped title", position: [5, 33], width: 80 },
  ],
  position: [0, 5],
  width: 100,
  height: 15,
}