InfiniteMarquee — Attribute snippets

Click any row to copy the ready-to-paste attribute + value string for HTML.
AttributeTypeExampleDefaultDescription
data-marquee-speed number 60 50 Movement speed in px/s.
data-marquee-direction enum right left Scroll direction: left, right, up, down.
data-marquee-gap number 20 40 Gap between items (px).
data-marquee-pause-on-hover boolean true true Hovering pauses the animation.
data-marquee-reverse-on-hover boolean true false Hovering reverses the scroll direction.
data-marquee-drag boolean true true Enable drag-to-scroll (mouse/touch).
data-marquee-fade boolean true false Apply fade mask to edges.
data-marquee-fade-size number 100 80 Fade mask size in px.
data-marquee-slow-on-hover boolean true false Slow animation while hovered (instead of pause).
data-marquee-slow-speed number 30 15 Slow speed in px/s when `slow-on-hover` is enabled.
Include script (CDN): <script src="https://cdn.jsdelivr.net/gh/ashfad0273/Infinite-Marquee@main/infinite-marquee.js"></script>