About Accordion Slider

Accordion Slider is a one-of-a-kind WebGL slider powered by Three.js and custom GLSL shaders. It is built for immersive visual presentations with natural and organic distortion, responsive drag controls, rich post-processing effects, captions, and flexible layout behavior for both desktop and mobile experiences.

Main features

Responsive Layout – Fully responsive and adaptable across desktop, tablet, and mobile devices.

Desktop & Mobile Optimized – Smooth dragging, touch support, and GPU-accelerated rendering on modern browsers.

Lazy Initialization – Optionally initialize the slider only when it becomes visible on screen, ideal for long pages and sections below the fold.

Flexible Sizing – Use responsive sizing or attach the slider to any parent container with custom dimensions.

Multiple Display Types – The slider can run in responsive mode or in “afterparent” mode to adapt to the parent container size.

Infinite Scroll – Seamlessly loops slider items in both directions for continuous browsing.

Parallax – Optional parallax scrolling effect.

Preloader – Optional animated preloader.

Captions Support – Add rich HTML captions with per-item title, description, and color styling.

Opacity Strength – Adjustable opacity effect for slider items that are not centered.

Customizable Item Scale and Gap – Configure minimum and maximum item scale values and gap between items.

Mouse Rotation – Optional mouse-based slight animated rotation effect, example here.

Item Noise Animation – Optional item noise animation with configurable strength and frequency, example here.

Scroll Speed Strength – Adjustable drag speed for smooth, responsive slider control with the mouse.

Scroll Bend Strength – Adjustable center bending intensity while scrolling or dragging.

Distortion Curve – Adjustable item distortion curve as the slider is dragged, example here.

Fluid Post-Processing Effect – Intro fluid effect with shader-based animation, example here.

Post-Processing Stack – Includes mouse ripple, fluid distortion, grid effect, afterimage, bulge, glitch, and noise.

12 Ready-to-Use Presets – Includes twelve preset configurations demonstrating different distortion and post-processing styles.

Detailed Documentation – Includes setup guides, settings reference, and examples for both standalone and WordPress usage: JavaScript Documentation and WordPress Documentation.

Support & Updates – Ongoing maintenance, product improvements, and direct support.