Scroll Reveal

Animate content into view as the user scrolls down the page. It is shown in the block inserter as Canvas Scroll Reveal and registered as canvas-core/scroll-reveal.

Select the block on a page and its own settings open in the sidebar, in the panels below:

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Content

• ContentDefaultEmpty

  What the reveal shows. The block renders nothing while this is empty.

Settings

• AnimationDefaultfadeInUp

  How the content arrives when the visitor scrolls it into view.

  ChoicesfadeInfadeInUpfadeInDownfadeInLeftfadeInRightzoomInslideInUpslideInLeftslideInRightbounceIn

• Delay (ms)Default0

  Pause before the animation starts. Give neighbouring reveals rising delays to have them arrive one after another.

• Speed (ms)Default400

  How long the animation itself runs, in milliseconds.

Related

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in Interactive: Accordions, AJAX Buttons, Carousels, Cookie Consent, Countdowns, Flip Cards.