HTML5 banner build guide

Make sure your ad is on screen (mobile app campaigns only)

When an ad first loads in a mobile app, it loads off-screen and out of view. If your ad animates or plays silent video, you should wait until the ad is on-screen to play it. If your ad won't serve in mobile apps, you can skip this step.

This method only works when an ad serves in a mobile app. When the ad serves in a desktop or mobile browser, the VISIBLE event is triggered as soon as the ad is rendered, however the ad may not be in view.

Find out when the ad is visible

  1. Wait for the Enabler to initialize.
  2. Check if the ad is visible by using the Enabler’s isVisible method, which returns true or false.
    1. If true, call a function that plays your animation or video, (in this example, adVisible).
    2. If false, listen for the Enabler’s VISIBLE event.

Sample JavaScript code

<script>
if (!Enabler.isInitialized()) {
  Enabler.addEventListener(
    studio.events.StudioEvent.INIT,
    enablerInitialized);
} else {
   enablerInitialized();
}
function enablerInitialized() {
  // Enabler initialized.
  // Ads are rendered offscreen in mobile apps so animation should wait for
  // the visible event. These are simulated with delays in the local
  // environment.
  if (!Enabler.isVisible()) {
    Enabler.addEventListener(
      studio.events.StudioEvent.VISIBLE,
      adVisible);
  } else {
     adVisible();
  }
}
function adVisible() {
  // Ad is now visible, add your code to start ad/animation.
}
</script>
Was this helpful?
How can we improve it?