Skip to main content

Demos

Simple Marquee​

A simple Marquee with default settings:

Vertical Marquee​

Vevet Marquee supports vertical mode:

Pause on Hover​

A simple Marquee that pauses when is being hovered:

Reverse Marquee​

A simple Marquee with reversed motion:

Controllable Marquee​

A marquee with controls:

With CSS units​

Marquee gap and speed may accept a string with css units like px, rem, vw, 'vh', 'svh':

With speed adjustment​

Marquee can adjust speed depending on user's FPS rate. This feature is enabled bby default. It helps make the marquee move the same way across displays with different update frequency.

Responsive Marquee​

Marquee, as any other component in Vevet, may bet customized depending on user's viewport sizes or their device type.

In this demo, marquee speed and gap are dynamic - they change depending on responsive breakpoints:

Draggable Marquee​

By default, Marquee does not support swiping. But this can be solved with Swipe:

Scrollable Marquee​

This is a combination of Marquee and ScrollProgress. With ScrollProgress, you can handle scrolling logic for your marquee element:

No clones​

By default, Marquee clones its nodes. This may be disabled if needed: