Skip to content

rogervila/jsmarquee

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jsmarquee

Build Status StyleCI Coverage Maintainability Rating

NPM

jsmarquee

About

jsmarquee is a pure javascript implementation of the old HTML marquee tag.

It is not tied to any css or javascript library, so it can be easily implemented on any frontend project.

Usage

Javascript setup

This is the default setup:

import Marquee from 'jsmarquee'

const m = new Marquee({
  element: '#marquee-demo',
  velocity: 1
})

m.run()

These are the accepted properties:

name value
element string with a query selector value
velocity number. integer usage is recommended

HTML and CSS setup

As said before, jsmarquee is not tied to any CSS library.

In order to work correctly this is the basic CSS needed:

<div class="my-marquee" id="marquee-demo">
    <div>
        content goes here. you can use any html tag, including images
    </div>
</div>
.my-marquee {
  overflow: hidden;
}

.my-marquee > div {
  display: inline-flex;
  position: relative;
}

Demos

License

jsmarquee is open-sourced software licensed under the MIT license.

Icons made by Alfredo Hernandez from www.flaticon.com