Tutorials

How to maximize viewability using portals

Portals are used to increase viewability, lower platform cost and enhance user experience by decreasing resource usage on the visitor's device. This example shows three containers that can move their content between each other through the portal.

Setup
adk.config()
    .addContainer('my-container', adk.container.config()
        .provider('adk.hello')
        .formats([300, 300])
        .lazy()
        .fill()
        .reload()
        .portal('my-container'))
    .apply()
    .init(publisherId)

The provider will deliver colored boxes in a specific order: red, green, blue. The viewability condition for the content has been set to 100% of the pixels inside the viewport for 2 seconds. A dashed border indicates that the box has been viewable.

Result