jagnani73 / react-easy-marquee

A highly customisable `marquee` package for React built using CSS. Renders anything given between the tags, be it an image, text or a custom JSX element!

Home Page:https://jagnani73.github.io/react-easy-marquee/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Multiple Marquees marquee in same direction

0xKurt opened this issue · comments

commented

Describe the bug
I created a row with 4 cols. The first and third col should marquee up, the second and fourth should marquee down, but they marquee all in the same direction.

Example Code:
`<Row className='' xs={4} style={{ minHeight: 'calc(100vh + 7px)', backgroundColor: 'purple' }}>
<div style={{ width: '25vw' }} className='pd-0'>

        {VIEWITEMS.imgs.map((image) => (
          <img src={image} alt="" style={{ width: '25vw', height: '25vw' }} />
        ))}
      </Marquee>
    </div>
    <div style={{ width: '25vw' }} className='pd-0'>
      <Marquee duration={100000} axis='Y' height='110vh' align='center' reverse={false}>

        {VIEWITEMS.imgs.map((image) => (
          <img src={image} alt="" style={{ width: '25vw', height: '25vw' }} />
        ))}
      </Marquee>
    </div>
    <div style={{ width: '25vw' }} className='pd-0'>
      <Marquee duration={100000} axis='Y' height='110vh' align='center' reverse={true}>

        {VIEWITEMS.imgs.map((image) => (
          <img src={image} alt="" style={{ width: '25vw', height: '25vw' }} />
        ))}
      </Marquee>
    </div>
    <div style={{ width: '25vw' }} className='pd-0'>
      <Marquee duration={100000} axis='Y' height='110vh' align='center' reverse={false}>

        {VIEWITEMS.imgs.map((image) => (
          <img src={image} alt="" style={{ width: '25vw', height: '25vw' }} />
        ))}
      </Marquee>
    </div>
  </Row>`

Package
i like your package so much. it's so easy to use - really nice job!

@KurtMerbeth this is the same as #11
I am aware of this bug however am unable to debug it.
Would you like to work on it?

Thank you for reporting it!