/marquee

A lightweight Javascript Marquee that uses RequestAnimationFrame and CSS Transforms

Primary LanguageJavaScriptMIT LicenseMIT

@egstad/marquee

A straight-forward Marquee

Install

npm install @egstad/marquee

Usage

Markup

<div class="marquee">
  <!-- Can be any html element you wish -->
  <p>Hello World</p>
</div>

<!-- Use the speed dataset to speed it up -->
<div class="marquee" data-speed="5">
  <p>Hello World</p>
</div>

Javascript

// import
import Marquee from '@egstad/marquee'

// init with class
const marquee = new Marquee('.className')

// init with element
const element = document.querySelector('.marquee')
const marquee = new Marquee(element)

Methods

// create instance
const marquee = new Marquee('.className')

// pause animation
marquee.stop()

// start over
marquee.reset()

// destroy events
marquee.destroy()