Vanilla JavaScript Marquee Library

Category: Animation , Javascript | December 2, 2018
Views Total:4,903 views
Official Page:Go to website
Last Update:December 2, 2018


Vanilla JavaScript Marquee Library


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
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

You Might Be Interested In:

One thought on “Vanilla JavaScript Marquee Library

Leave a Reply