Marquee

Large text lines slide horizontally as the page is scrolled vertically.

Add a "Text Marquee on Scroll" (also called a scroll text marquee or scroll velocity text) to [where].
Large lines of text should slide sideways as the page scrolls down, with alternate rows moving in opposite directions, and slide back when scrolling up.
Tie the movement to the scroll position, keep the long lines from causing a horizontal scrollbar, and keep them still for users who prefer reduced motion.

Slides move horizontally past a viewport, snapping one item into place at a time.

Add a "Carousel Slide" (also called a slider or swipe carousel) to [where].
Each step should slide the row sideways so the next slide snaps into the center, smooth and decelerating, with the neighbours peeking at the edges and the position dots following along.
Move one slide at a time, support swipe on touch as well as buttons and arrow keys, and keep the controls labelled for screen readers.

Vertical scrolling moves a pinned row of panels sideways.

Add a "Horizontal Scroll Section" (also called horizontal scrolling or a scroll-jacked horizontal gallery) to [where].
When the section reaches the top it should stay pinned while scrolling down moves its row of panels sideways, then release once the last panel is in view.
Tie the sideways movement directly to the scroll position so scrolling back reverses it, and fall back to a normal swipeable row on small screens or for users who prefer reduced motion.

Grid tiles rearrange, fade out or slide into new slots when a filter or sort is applied.

Add a "Masonry / Grid Shuffle" effect (also called a filterable grid animation) to [where].
When a filter is applied, the tiles that no longer match should shrink and fade out in place while the remaining tiles slide smoothly into their new slots; clearing the filter plays it back.
Keep the surrounding page from jumping while the grid changes height, and make the filter controls real buttons that expose which filter is selected.

A dialog fades in while scaling up slightly from its center over a dimmed page.

Add a "Modal Scale-Fade In" animation (also called a dialog open animation or zoom-fade dialog) to [where].
The dialog should fade in while scaling up slightly from its center as the page behind it dims: quick and subtle, with no bounce.
Play it once each time the dialog opens, move focus into it and keep it there, and use a plain fade for users who prefer reduced motion.

A floating menu fades and scales in from the point where its trigger sits.

Add a "Popover / Dropdown Open" animation (also called a menu pop or dropdown scale-fade) to [where].
The menu should fade in while growing slightly out of the corner next to its trigger, quick and crisp, and fade out a little faster when it closes.
Keep it anchored to the trigger, close it with Escape or a click outside, and expose the open state on the trigger for screen readers.