CMS Sliding Stack

Create a sophisticated CMS/Gallery/Static images stacked card carousel, that delivers professional-grade performance and UX.

🎯 Purpose: The component creates an elegant stacked card carousel that showcases dynamic CMS images/Gallery type field images/Static separate images, with smooth animations, instant loading, and intuitive navigation controls.

📊 Data Source Flexibility:

• Connect to Framer Collection Lists for dynamic CMS content

• Link to Gallery components for curated image sets

• Use static image arrays for fixed content

• Seamless switching between data sources

✨ Key Features:

• Stacked card visual style with customizable offset spacing

• Ultra-performance lazy loading system with predictive preloading

• Smooth drag-and-drop navigation with momentum physics

• Precision scroll control (vertical and horizontal wheel support)

• Auto-rotation with intelligent pause during user interaction

• Full-screen Lightbox with keyboard navigation

• Responsive image optimization with format detection (WebP/AVIF)

⚙️ Customization Options:

• Flexible tile dimensions (full height or defined sizes)

• Image ratio preservation controls

• Stack offset adjustment for visual depth

• Auto-rotation speed configuration

• Lightbox styling and behavior settings

• Background color customization

🎨 Visual Design:

• Smooth CSS3 animations with hardware acceleration

• Dynamic shadows and scaling effects

• Professional blur-to-sharp image loading transitions

• Clean, modern lightbox interface

• Responsive design that adapts to container size

🖱️ User Interactions:

• Drag cards left/right to navigate

• Mouse wheel scrolling in any direction

• Touch-friendly mobile gestures

• Click to open full-screen lightbox

• Keyboard shortcuts in lightbox mode

• Smart interaction detection to prevent conflicts

💡 Best Use Cases: Perfect for portfolios, product showcases, image galleries, testimonials with photos, case studies, and any scenario requiring elegant image presentation with CMS integration.