@seberm/react-marquee

React Marquee using GSAP

The animation direction reflects the clients scroll direction

Scrolling takes over the animation speed

Live demo

Install

npm install --save @seberm/react-marquee

Usage

import React, { Component } from 'react'

import Marquee from '@seberm/react-marquee'

const Example = () => {
  return (
    <Marquee spacing="20">
      <h2>Hello World<h2>
    </Marquee>
  )
}

CSS

.marquee-container, .marquee-wrap  {
  overflow:hidden;
}
.marquee {
  position:absolute;
}

Props

name	type	default	description
reverse	boolean	false	animates from left to right
separation	number	0	separation between each child in px

License

MIT © Ermilin

---