A smooth-scrolling React <marquee> component that loops content.
npm install react-double-marquee !npm downloads
 

Lo-fi demo:
View the demos page for live examples.
- Contents
- Getting Started
- Demos
- Usage
- Props
- Developing
- Installing
- Building
- Testing
- Linting
- Releasing
- License
Demos can be found here.
Install as a dependency:
```
$ npm install --save react-double-marquee
Then, import it and wrap it in an element that does not display overflow:
`js
import Marquee from 'react-double-marquee';
export default function FooComponent() {
return (
$3
| Key | Type | Default | Description |
| ------------- | ----------------- | -------------------------------------- | ---------------------------------------------- |
|
speed | Number | 0.04 | Movement speed, in pixels/millisecond. |
| delay | Number | 3000 | Time until animation begins, in milliseconds. |
| direction | "right"\|\|"left" | "right" | Horizontal direction. |
| childMargin | Number | 10 | Horizontal margin between children, in pixels. |
| children | React node | None | Children to render within the marquee. |
| scrollWhen | "overflow"\|\|"always" | "always" | Whether the text always scrolls, or only when the content overflows the container width. |Developing
First, clone the repository.
$3
Install dependencies:
`
$ npm install
`$3
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
`$3
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
`$3
To run the linter:
`
$ npm run lint
`$3
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
``MIT