A seamless horizontal carousel component with smooth infinite scrolling, responsive design, accessibility features, and extensive customization options.
Experience the smooth, seamless scrolling with touch support and responsive behavior.
Everything you need for a production-ready carousel solution.
Optimized for speed with GSAP's powerful animation engine
Smooth continuous scrolling without visible resets or jumps
Configurable breakpoints with different items per viewport
Optional drag-to-scroll with momentum and inertia
Configurable automatic advancement with pause/resume
Previous/next buttons with full keyboard support
Visual indicators with click-to-navigate functionality
Full ARIA support and screen reader compatibility
Option to center the active slide in the viewport
Debounced updates and efficient DOM manipulation
<div id="carousel-container">
<div class="slide">Slide 1</div>
<div class="slide">Slide 2</div>
<div class="slide">Slide 3</div>
</div>const carousel = horizontalLoop("#carousel-container", {
responsive: {
0: { items: 1 },
768: { items: 2 },
1024: { items: 3 }
},
speed: 1.2,
gap: "20px",
draggable: true,
autoplayDelay: 3
});Download the production-ready carousel and start building amazing experiences.