npm

Need private packages and team management tools?Check out npm Orgs. »

react-double-marquee

0.3.4 • Public • Published

react-double-marquee

A React marquee component that smoothly loops content.

npm version Build Status Coverage Status semantic-release

Lo-fi example:

Example

View the demos page for live examples.

Contents

Getting Started

Demos

Demos can be found here.

Usage

Install as a dependency:

$ npm install --save react-double-marquee

Then, import it and wrap it in an element that does not display overflow:

import Marquee from 'react-double-marquee';
 
export default function FooComponent() {
  return (
    <div
      style={{
        width: '200px',
        whiteSpace: 'nowrap',
      }}
    >
      <Marquee>
        Some really really really really really long text
      </Marquee>
    </div>
  );
}

Props

Key Type Default Description
speed Number 0.04 Movement speed, in pixels/millisecond.
delay Number 3000 Time until animation begins, in milliseconds.
childMargin Number 10 Horizontal margin between children, in pixels.
children React node Children to render within the marquee.

Developing

First, clone the repository.

Installing

Install dependencies:

$ npm install

Building

To build the package bundle:

$ npm run build

To build the bundle with live rebuilding:

$ npm run watch

To run the demos with live reload:

$ npm run dev

Then, open http://localhost:8001 to view the demo docs.

To build the static docs website (e.g. for GitHub Pages):

$ npm run docs

Testing

To run tests:

$ npm run test

To run tests in watch mode:

$ npm run test:watch

To run tests with coverage reporting:

$ npm run test:coverage

Linting

To run the linter:

$ npm run lint

Releasing

Releases are done automatically via Travis CI and semantic-release from the master branch.

To verify the repos for release:

$ npm run release:verify

To run the release script as a dry-run:

$ npm run release

License

MIT

install

npm i react-double-marquee

Downloadsweekly downloads

196

version

0.3.4

license

MIT

last publish

collaborators

  • avatar
Report a vulnerability