Vanilla JavaScript Marquee Library

Preview:

Description:

A lightweight Vanilla JS marquee library which infinitely scrolls through web content in RTL or LTR direction.

Ideal for stock ticker, text slider, breaking news scroller, etc.

How to use it:

Download and insert the marquee.js library into the html file.

<script src="marquee.js"></script>

Create a new Marquee instance and specify the target content to scroll through.

<div id="example">
  Your Content Here
</div>

new Marquee('example');

Set the direction to RTL.

new Marquee('example', {
    direction: 'rtl'
});

Config the animation speed.

new Marquee('example', {
    speed: 1 // default: .5
});

Set the delay in milliseconds.

new Marquee('example', {
    // pause between loops
    delayAfter: 1000,
    // when to start
    delayBefore: 0
    
});

Enable/disable infinite scroll.

new Marquee('example', {
    loops: -1
});

Decide whether to scroll only once.

new Marquee('example', {
    continuous: true
});

Customize the appearance.

new Marquee('example', {
    bgcolor: '#000',
    textcolor: '#fff',
    opacity: 1
});