DEV Community

Cover image for fluid-marquee: Smart Overflow-Aware Marquee Scroller
jQueryScript
jQueryScript

Posted on

fluid-marquee: Smart Overflow-Aware Marquee Scroller

fluid-marquee: a zero-dependency JavaScript library that adds smart scrolling marquees to any container element.

Key highlights:

  • Only scrolls when content overflows the container, stays centered when it fits
  • Horizontal or vertical direction with configurable speed in pixels per second
  • Drag-to-scrub support on mouse and touch, with momentum on release
  • Compositor-thread animation via the Web Animations API for steady performance
  • Pause on hover or click with smooth ease transitions
  • Full programmatic API for pause, resume, and dynamic item management
  • Auto-pauses when scrolled off-screen, recalculates on resize and image load

Works via a single class name with no setup JavaScript required for basic use. Available on npm and CDN.

👉 Blog Post

👉 GitHub Repo

👉 Live Demo

Top comments (0)