Parting Text

Parting Text is a scroll-driven section that turns a statement into a moment. A block of large text scrolls up the page while an image or video holds in place and passes straight through its middle. Every line splits at its centre word, and as the media reaches it the two halves are pushed apart just far enough to let it through, then close again behind it. The text and the media move together on one smoothed scroll, so the image never slides over the words. Once the media clears the last line, plus a distance you choose, it grows to fill a set share of the screen, holds, then scrolls away with the page.

Built for brand statements, about sections, product launches, manifestos and portfolio intros.

Features

Text: any copy, with full font controls, colour and max width. Lines split where the two halves are most balanced; press Return to force a break.

Media: image or video (MP4, WebM or MOV), with width, height, radius, fill or fit, and a fill colour.

Natural scroll: the text moves exactly as far as you scroll while the media holds at a height you choose, with optional smoothing that turns wheel steps into short glides.

Pass: where the media holds, start gap, pass distance after the last line, clearance around the media, how early lines start to part and scroll smoothing. Lines can close behind the media or stay open.

Grow: final width and height as a % of the screen, end radius, scroll length, a hold before the page moves on, and an optional text fade.

Responsive: text and media shrink together on narrow screens, and lines wrap so an open line always fits.

Canvas preview: pick any moment of the sequence to show on the canvas.

Accessible: the full text stays in the page once for screen readers and search engines, and reduced motion is respected.

Efficient: words are measured with Pretext without DOM layout, transforms are written straight to the page, and videos pause off screen.

Editable code: open, documented source with a guide for AI coding agents.