Getting Started

Track Scroll Goals

Track important page sections automatically when visitors scroll them into view. Add data-revlly-scroll to any element and Revlly sends a custom goal once the visibility threshold is reached.

Overview

html
<section data-revlly-scroll="viewed_pricing">  <h2>Pricing</h2>  <p>Choose the plan that fits your team.</p></section>

How it works

  • Default visibility threshold is 0.5, meaning 50% of the element must be visible.
  • Each element triggers once per page visit.
  • Scroll goals appear with other custom goals and can be used in funnels and goal filters.
  • Goal names use lowercase letters, numbers, underscores, and hyphens, up to 64 characters.

Advanced options

Use data-revlly-scroll-threshold to change the visible percentage and data-revlly-scroll-delay to require the element to stay visible before tracking.

html
<section  data-revlly-scroll="viewed_pricing"  data-revlly-scroll-threshold="0.7"  data-revlly-scroll-delay="1000"  data-revlly-scroll-section="pricing">  <h2>Pricing</h2></section>

Extra data-revlly-scroll-* attributes are stored as goal properties, except for threshold and delay.