Marquee

Dependencies:

MarqueeItem

2.0.0

Requires Celeste 3.0.0

Install or Update

wp celeste pull component Marquee

Dependencies will automatically be installed.

Properties

Prop	Description
`gap`	Valid CSS unit for the gap between items, e.g. `12px` or `var(--space-xs)`. Defaults to `var(--space-sm)`
`speed`	Valid CSS unit for the speed, in time. e.g. `20ms`, `10s`. Defaults to `40s`
`pauseOnHover`	Whether the Marquee should pause when hovered, `true` or `false`

How to use it

<Marquee pauseOnHover>
    <Marquee.Item class="bg-red-500">
        <img src="https://unsplash.it/300?random=1" width="200" height="200" alt="">
    </Marquee.Item>
    <Marquee.Item>
        <img src="https://unsplash.it/300?random=2" width="200" height="200" alt="">
    </Marquee.Item>
    <Marquee.Item>
        <img src="https://unsplash.it/300?random=3" width="200" height="200" alt="">
    </Marquee.Item>
    <Marquee.Item>
        <img src="https://unsplash.it/300?random=4" width="200" height="200" alt="">
    </Marquee.Item>
    <Marquee.Item>
        <img src="https://unsplash.it/300?random=5" width="200" height="200" alt="">
    </Marquee.Item>
    <Marquee.Item>
        <img src="https://unsplash.it/300?random=6" width="200" height="200" alt="">
    </Marquee.Item>
</Marquee>