How Scrollsequence works

Scrollsequence is a WordPress add-on that turns image sequences into animations controlled by the mouse wheel or touch. Add a sequence to a homepage, post, or page for a product presentation, visual story, campaign, portfolio, or other visual content.

Pro and Business plan capabilities

Pro plan

Pro includes fade-in, fade-out, move, and scale animations that respond to scrolling. It supports unlimited scenes and images, a smooth scroll delay, and a setting for how many images load before the animation appears. The editor also works with HTML content, so written components can animate in sync with media. Content added to Scrollsequence is indexable, and the plan includes priority support.

Business plan

Business includes cloud tools for preparing visual sequences from video. Video to Image Converter converts source video into a sequence of images. AI Frame Former can increase the number of frames through the cloud service, which can help make smoother animation. Business users can also import still images from a video into the WordPress Media Gallery with one click.

Editing and placing a sequence

Scrollsequence includes a WYSIWYG editor, shortcode support, and oEmbed. Use HTML drag and drop to reorder scenes, images, and animations. Upload images or choose them from the WordPress backend media gallery; preloading fetches images in the background. Other controls include custom CSS, image opacity, background color, scroll speed, and a fallback for visitors with JavaScript disabled. Options let you conceal or display the footer and sidebar.

To add a saved sequence to a post or page, use [scrollsequence id="####"].

Display, compatibility, and loading

Mobile and desktop sizing and alignment options are available. Scrollsequence can be used with Gutenberg, Elementor, Divi, Oxygen, Beaver Builder, and other page-building environments. Themes that preserve normal scrolling are recommended; custom scrollbars or AJAX transitions may affect integration.

Install and activate the plugin in WordPress, then create a sequence in the editor. Upload or select images, arrange scenes, set animation and loading options, and save. Add the sequence shortcode to the required post or page. Business users can prepare source material with the cloud media tools before importing or using the resulting images.

During loading, Scrollsequence fetches the first images and displays the animation after a minimum number have finished loading. The remaining images continue loading in the background. Review the sequence on desktop and mobile, then adjust sizing, alignment, speed, opacity, or custom CSS as needed.