Date : 16th June 2024

For all the latest browsers except iOS Safari

Animation-timeline scroll()

Information

Suitable for Firefox from version 114: 'animation-timeline:scroll()' is behind the layout.css.scroll-driven-animations.enabled preference (needs to be set to true using about:config).

The above gallery has a vertical scrollbar, but the gallery scrolls horizontally.

This uses animation-timeline:scroll() and works in all the latest browsers except iOS Safari.

Each ot the images can be click/tapped to show an enlarged image. This uses the fairly new popover style and is triggered by the button element.

The popover image has a blurred page background and stops the page from scrolling in the background.

Please consider making a donation, every little helps.