1. Home
3. Reference Docs
5. Daily JS
7. Factory Methods
9. createFrame()

createFrame()

createFrame(parentEl, {properties})

Use this method to create a DailyIframe element and insert it into the DOM.

Both arguments are optional. If you provide a parentEl, the new DailyIframe will be appended as a child of that element. Otherwise, the new DailyIframe will be appended as a child of document.body.

The second argument is a properties object. If you don't set at least the url property here, you'll need to set it later when you call the join() or load() method.

Styling the DailyIframe

iframeStyle

You can set the CSS properties of the new DailyIframe by passing a javascript-style css properties hash in the iframeStyle property, like so:

The default iframeStyle (styles applied to the iframe if you don't supply any) depend on whether the new DailyIframe is a child of document.body or not. If the new DailyIframe is a child of document.body, the defaults position the iframe as a floating window in the bottom right of the page. If, on the other hand, you specify a parentEl deeper in the DOM tree, the defaults fill the width and height of the parent element.

layoutConfig

When the default Active Speaker View is turned off (through the activeSpeakerMode iframe property or setActiveSpeakerMode() method), Grid View can be customized via a layoutConfig iframe property. layoutConfig specifies the maximum and minimum participant tiles per page when a browser is resized: