-
-
Notifications
You must be signed in to change notification settings - Fork 240
Open
Labels
bugSomething isn't workingSomething isn't working
Description
Which variants of Embla Carousel are you using?
- embla-carousel (Core)
- embla-carousel-react
- embla-carousel-vue
- embla-carousel-svelte
- embla-carousel-autoplay
- embla-carousel-auto-scroll
- embla-carousel-solid
- embla-carousel-auto-height
- embla-carousel-class-names
- embla-carousel-fade
- embla-carousel-docs (Documentation)
- embla-carousel-docs (Generator)
Steps to reproduce
The bug occurs when I drag the carousel to see more cards
Expected Behavior
please check my website and check what's happening , i have many carousels on this website
https://www.granipan.com
Additional Context
i use the same method for all the carousels:
const options = { direction: 'rtl' }
const [sinksEmblaRef, sinksEmblaApi] = useEmblaCarousel(options)
const [stonesEmblaRef, stonesEmblaApi] = useEmblaCarousel(options)
const [postsEmblaRef, postsEmblaApi] = useEmblaCarousel(options)
const [projectsEmblaRef, projectsEmblaApi] = useEmblaCarousel(options)
<div ref={sinksEmblaRef} className="overflow-hidden mt-10">
<motion.div
initial={{ scale: 0, opacity: 1 }}
whileInView={{ scale: 1, opacity: 1 }}
transition={{
type: 'spring',
stiffness: 260,
damping: 20,
delay: 0.3,
}}
className="flex pb-2.5"
>
{sinks?.docs?.map((sink, i) => (
<Card
key={i}
product={sink}
path={`/sink`}
button={globals?.sink?.details}
/>
))}
</motion.div>
</div>
What browsers are you seeing the problem on?
Chrome, Firefox, Safari, Microsoft Edge, All browsers
Version
8.6.0
CodeSandbox
Before submitting
- I've made research efforts and searched the documentation
- I've searched for existing issues
- I agree to follow this project's Contributing Guidelines for bug reports
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working