Question

Is it possible to have a property/variable for a carousel to set number of slides in the component instance?

Forum|Forum|2 years ago
August 11, 2024
23 replies
337 views

Hi guys,

Thanks as always to this fantastic community, had some invaluable advice before and it’s really appreciated!!

I’ve made a carousel, with pagination dots at the bottom and the biggest number of cards I need in it is 12.

However sometimes I will need less, and so I’m wondering if I can use boolean properties to choose the number of slides in the component instance?

It would also be great to be able to choose/link the pagination dots so that the corresponding value of slides needed, also removes excess pagination dots.

I’m just in the process of building out the gallery in my website prototype using my first instance use of the component, and I’m trying to have to avoid making the same component 12 times:

with 1 slide
with 2 slides
with 3 slides
etc

Any suggestions would be great here, as I’m having a block as to how best to approach it 🙂
Thank you

Ask the community

This topic has been closed for replies.

Show previous replies

KennLucas

How did you create your pagination component?

Is that just one row or do you have 12 states of dots?

N

newpurpleAuthor

I have a component with 12 variations

KennLucas

OK. Gotcha.

And you applied the interactions to EACH different instance on EACH of the component variants right?

I think I hurt my brain trying to do this without all the variants. 🤯

KennLucas

OK I THINK I have it…I just need some time to make it work. 🤞

N

newpurpleAuthor

Yes I did - I linked all of the dots on each of the 12 variations to every other page

KennLucas

Sorry purple.

This one is just not coming together.

I created an infinite carousel, but cannot hide the things you want to hide.

I also created a pretty good one that keeps things centered if you start turning off cards…but eventually you will end up with black space on the sides as the cards will run out. This is also an issue as they have to repeat to make it wrap and if you hide too many, you get duplicates.

So…sorry to have to let you down. But this one is not in my wheelhouse.

Raphael_M

Power Member

Why is the carousel pagination like that?

11/12/1 /2/3/4/5/6/7/8/9/10

is the way of navigation only the pagination or it also comes with arrows? If it’s just the pagination, i think it should be easier.

Raphael_M

Power Member

However sometimes I will need less, and so I’m wondering if I can use boolean properties to choose the number of slides in the component instance?

Yes. But that is weird. Normally, you wouldn’t use true/false on choosing the number of slides you wanted.

It would also be great to be able to choose/link the pagination dots so that the corresponding value of slides needed, also removes excess pagination dots.

It’s possible if were going to control the number of slides of your component.

Raphael_M

Power Member

I tried it, its quite buggy though there’s too many layers. Another issue is I can’t put the Card 12 on the left of the 1, i also don’t think that’s how pagination works. We can make infinite carousel without pagination though.

981336c08c71f6358a0cfeb821ec50b43ff6b547.zip

KennLucas

How are things working out? I love the work that @Raphael_M did in that video! Sexy! I came up with that same result but kept failing when trying to bring your cards to the start.

The only way to do that I know of is the infinite thing where you basically repeat the first two cards at the end and then string your interactions back to the start.

I agree that what you are asking is not quite how pagination works. That would be the real challenge. Sorry I can’t be more help. But please do post an update on what you end up doing!

Show more replies

Sign up

Login with SSO

Login to the community

Login with SSO