Intersection Module

Overview

The Intersection module provides intersection for ad slots on the page using Intersection Observer API.

Implementation works like this:

  1. Build the Intersection module into the Prebid.js package with:

     gulp build --modules=intersectionRtdProvider&...

  2. Use setConfig to instruct the browser to obtain the intersection data

Configuration

This module is configured as part of the realTimeData.dataProviders object:

pbjs.setConfig({
    "realTimeData": {
        auctionDelay: 100,
        dataProviders:[{          
            "name": "intersection",
            "waitForIt": true
        }]
    }
});

Output

For each bidder, the module adds intersection in a JSON format. Example:

{
  "intersection":{
    "boundingClientRect": {
      "left": 10,
      "top": 10,
      "right": 310,
      "bottom": 260,
      "width": 300,
      "height": 250,
      "x": 10,
      "y": 10,
    },
    "intersectionRect": {/* ... */},
    "rootRect": {/* ... */},
    "intersectionRatio": 0.5,
    "isIntersecting": false,
    "time": 1636993868145
  }
}