Infinite ImageScroll

Infinite ImageScroll is the ultimate nested image component for Framer.

Tutorial Tutorial for Infinite ImageScroll Details Infinite ImageScroll is the ultimate nested image component for Framer. Create mesmerizing, infinitely nested image sequences that zoom deeper with every scroll. Upload your sequence of images and watch as each one seamlessly reveals the next in a hypnotic, continuous animation. Comes with two scroll modes (Normal & Endless) which lets you add this effect to one section of a page that cycles once and then continues scrolling to the next section of your page or Endless to have the effect take up an entire page. Designed with smooth spring physics, Infinite ImageScroll brings captivating visual storytelling to your website. Perfect for creating unique, memorable user experiences that keep visitors engaged. 🖱️ Pick between two scroll modes (Normal and Endless) to add this effect for one section of a page (Normal) or for an entire page (Endless). Normal Mode - Scrolls through all images once, then releases scroll control to page Endless Mode - Loops infinitely through your image sequence for continuous exploration Features Scroll-driven animation - Natural wheel/trackpad scrolling controls the zoom depth Infinite nesting effect - Each image contains and reveals the next one nested inside Two scroll modes : Normal (one complete cycle) or Endless (infinite looping) Smooth spring physics - Customizable spring stiffness and damping for fluid motion Upload multiple images - Support for image sequences of any length Canvas-based rendering - High-performance animation using HTML5 canvas Responsive-ready - Images automatically scale and crop to fill the frame Mobile optimized - Works seamlessly on touch devices Customizations Scroll Mode Toggle - Switch between Normal (single cycle) and Endless (infinite loop) Spring Stiffness - Adjust scroll smoothness (50-300, higher = snappier response) Spring Damping - Control scroll resistance (10-100, higher = less bounce) Alt text for images - Accessibility-friendly labeling for each layer Technical Highlights Spring-based animation - Powered by Framer Motion for buttery-smooth transitions Image preloading - All images load before animation begins for seamless playback Responsive resize handling - Maintains aspect ratio and quality at any viewport size Great for: Creative portfolios - Showcase work in an unforgettable way Photography galleries - Create dream-like sequences of related images Product launches - Build anticipation with progressive reveals Storytelling websites - Guide users through visual narratives Art installations - Digital galleries with mesmerizing depth Brand experiences - Stand out with unique, interactive presentations Concept explorations - Present ideas that unfold layer by layer Architectural visualizations - Show spaces from macro to micro perspectives

Mesmerizing, endless image scroll effect