Stay organized with collections Save and categorize content based on your preferences.
This class represents a container for displaying ads. The SDK will automatically create structures inside the containerElement parameter to house video and overlay ads.
When an instance of this class is created, it creates an IFRAME in the containerElement and loads the SDK core. This IFRAME must be preserved in order for the SDK to function properly. Once all ads have been played and the SDK is no longer needed, use the destroy() method to unload the SDK.
The containerElement parameter must be an element that is part of the DOM. It is necessary to correctly position the containerElement in order for the ads to be displayed correctly. It is recommended to position it above the content video player and size it to cover the whole video player. Refer to the SDK documentation for details about recommended implementations.
Note: It is always necessary to call the initialize() method in code that was directly invoked by a user action (such as a click or tap).
Initializes the internal video elements for playback.
Constructors
constructor
new AdDisplayContainer(containerElement: Element, videoElement?: HTMLVideoElement, clickTrackingElement?: Element): AdDisplayContainer
Constructor.
Parameters
containerElement: Element
The element to display the ads in. The element must be inserted into the DOM before creating AdDisplayContainer.
OptionalvideoElement: HTMLVideoElement
Specifies the alternative video ad playback element. We recommend always passing in your content video player.
OptionalclickTrackingElement: Element
Specifies the alternative video ad click element. Leave this null to let the SDK handle clicks. Even if supplied, the SDK will only use the custom click tracking element when non-AdSense/AdX creatives are displayed in environments that do not support UI elements overlaying a video player (for example, iPhone or pre-4.0 Android). The custom click tracking element should never be rendered over the video player because it can intercept clicks to UI elements that the SDK renders. Also note that the SDK will not modify the visibility of the custom click tracking element. This means that if a custom click tracking element is supplied, it must be properly displayed when the linear ad is played. You can check google.ima.AdsManager.isCustomClickTrackingUsed when the google.ima.AdEvent.Type.STARTED event is fired to determine whether or not to display your custom click tracking element. If appropriate for your UI, you should hide the click tracking element when the google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED event fires.
Destroys internal state and previously created DOM elements. The IMA SDK will be unloaded and no further calls to any APIs should be made.
initialize
initialize(): void
Initializes the internal video elements for playback. You must call this method as a direct result of a user action, so that the browser can mark the video element as user initiated.
Some browsers will allow video playback without user interactions if the video is muted. For this behavior, use AdsRequest.setAdWillPlayMuted(true) and call this method before AdsManager.start().
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-01-17 UTC."],[[["\u003cp\u003eThis class, \u003ccode\u003eAdDisplayContainer\u003c/code\u003e, is a container for displaying ads, automatically creating the necessary structures within the specified \u003ccode\u003econtainerElement\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eUpon creation, \u003ccode\u003eAdDisplayContainer\u003c/code\u003e loads the SDK core into an IFRAME, which must be preserved for the SDK to function and destroyed by the \u003ccode\u003edestroy()\u003c/code\u003e method when the ads have finished playing.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003econtainerElement\u003c/code\u003e should be part of the DOM and positioned correctly, preferably above the content video player and sized to cover it, for ads to display correctly.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003einitialize()\u003c/code\u003e method must be invoked directly by a user action to enable video playback and should also be called before \u003ccode\u003eAdsManager.start()\u003c/code\u003e, if you want the video to play muted on certain browsers.\u003c/p\u003e\n"],["\u003cp\u003eThe constructor accepts a required \u003ccode\u003econtainerElement\u003c/code\u003e and optional parameters such as the \u003ccode\u003evideoElement\u003c/code\u003e and \u003ccode\u003eclickTrackingElement\u003c/code\u003e, where the latter should not be rendered over the video player, preventing interception of UI elements.\u003c/p\u003e\n"]]],[],null,["| **Note:** This reference page follows TypeScript documentation structure. If you have suggestions for or see issues with the reference documentation, open a thread with your feedback on the [IMA technical forum](https://groups.google.com/g/ima-sdk/).\n\n*** ** * ** ***\n\n\nThis class represents a container for displaying ads. The SDK will automatically create\nstructures inside the containerElement parameter to house video and overlay ads.\n\n\nWhen an instance of this class is created, it creates an IFRAME in the containerElement\nand loads the SDK core. This IFRAME must be preserved in order for the SDK to function\nproperly. Once all ads have been played and the SDK is no longer needed, use the\n`destroy()` method to unload the SDK.\n\n\nThe containerElement parameter must be an element that is part of the DOM. It is necessary\nto correctly position the containerElement in order for the ads to be displayed correctly.\nIt is recommended to position it above the content video player and size it to cover the\nwhole video player. Refer to the SDK documentation for details about recommended\nimplementations.\n\n\n**Note:** It is always necessary to call the `initialize()` method in code\nthat was directly invoked by a user action (such as a click or tap).\n\n| Constructors ||\n|-----------------------------------------------------------------------------------------------------------------------------------------------------------|--------------|\n| [constructor](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer#google.ima.AdDisplayContainer.constructor) | Constructor. |\n\n| Methods ||\n|---------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------|\n| [destroy](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer#google.ima.AdDisplayContainer.destroy) | Destroys internal state and previously created DOM elements. |\n| [initialize](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer#google.ima.AdDisplayContainer.initialize) | Initializes the internal video elements for playback. |\n\nConstructors\n\n*** ** * ** ***\n\nconstructor \nnew AdDisplayContainer(containerElement: Element`, `videoElement?: HTMLVideoElement`, `clickTrackingElement?: Element): [AdDisplayContainer](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer) \nConstructor.\n\n| Parameters ||\n|-----------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| containerElement`: `Element | The element to display the ads in. The element must be inserted into the DOM before creating AdDisplayContainer. |\n| `Optional`` `videoElement`: `HTMLVideoElement | Specifies the alternative video ad playback element. We recommend always passing in your content video player. |\n| `Optional`` `clickTrackingElement`: `Element | Specifies the alternative video ad click element. Leave this null to let the SDK handle clicks. Even if supplied, the SDK will only use the custom click tracking element when non-AdSense/AdX creatives are displayed in environments that do not support UI elements overlaying a video player (for example, iPhone or pre-4.0 Android). **The custom click tracking element should never be rendered over the video player** because it can intercept clicks to UI elements that the SDK renders. Also note that the SDK will not modify the visibility of the custom click tracking element. This means that if a custom click tracking element is supplied, it must be properly displayed when the linear ad is played. You can check google.ima.AdsManager.isCustomClickTrackingUsed when the google.ima.AdEvent.Type.STARTED event is fired to determine whether or not to display your custom click tracking element. If appropriate for your UI, you should hide the click tracking element when the google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED event fires. |\n\n| Returns ||\n|------------------------------------------------------------------------------------------------------------------------|---|\n| [AdDisplayContainer](/interactive-media-ads/docs/sdks/html5/client-side/reference/class/google.ima.AdDisplayContainer) | |\n\nMethods\n\n*** ** * ** ***\n\ndestroy \ndestroy(): void \nDestroys internal state and previously created DOM elements. The IMA SDK will be unloaded and no further calls to any APIs should be made.\n\n*** ** * ** ***\n\ninitialize \ninitialize(): void \nInitializes the internal video elements for playback. You must call this method as a direct result of a user action, so that the browser can mark the video element as user initiated. \n\nSome browsers will allow video playback without user interactions if the video is muted. For this behavior, use `AdsRequest.setAdWillPlayMuted(true)` and call this method before `AdsManager.start()`."]]