Scroll Depth



If your site has scroll depth detection enabled, you should add an additional parameter to the __reach_config object to ensure additional accuracy.

  __reach_config = {
  content_height: $heightInPixels,

Please replace $heightInPixels with the actual height of the content, in pixels.


It may be the case that your site does not support automatic scroll depth detection (i.e. infinite scroll). If we let you know that this is the case, you will need to manually implement scroll depth detection as follows:

Whenever the user scrolls to a given quartile (i.e. percentage of content depth—25, 50, 75, 100), create an event that runs the following code:


The only values accepted for percentage are 25, 50, 75, or 100.

Additionally, be sure and add the manual_scroll_depth: true parameter to your existing __reach_config object, like so:

  __reach_config = {
  manual_scroll_depth: true,

You may test that your scroll depth is firing properly by turning on logging with the following command in the console:


You should then be able to see the events logged in your console as you scroll through the page. Be certain that these events fire only once. They should look something like this:

[info] sending scrollDepth of 25
[info] sending scrollDepth of 50
[info] sending scrollDepth of 75
[info] sending scrollDepth of 100

If you have attempted to send an invalid amount (i.e. any amount other than 25, 50, 75, or 100) to SPR.scrollDepthReached(), you will see the following error:

[undefined] Invalid amount please send scroll depths of only: 25, 50, 75 or 100