An interactive React component featuring smooth multi-layer parallax effects that respond to cursor movement. The component creates an engaging 3D depth illusion by animating two separate image layers at different speeds and offsets as users move their mouse across the block. Key Features: - Dual-layer parallax system with independent animation timings (350ms base layer, 250ms overlay) - 9-state responsive base layer that changes images based on cursor position (center, top, right, bottom, left, and diagonal directions) - Dynamic overlay animation with smooth transitions between open/closed states - Configurable offset limits (10px for base layer, customizable for overlay) - Optimized performance with CSS transforms and transitions - Fully responsive and works on any container size
Last Updated 7 days ago
