Navigation arrow buttons on carousel

[fm]

Hey guys,

I'm having a problem with the 'previous' arrow button on the carousel addon - it is too close to my site title and the arrow does not work. I would love to be able to get rid of it, but can't think of what css to use.

Cheers for the help!

[mariusjopen]

Hi @fm
you can remove the buttons here:

Does that help?

Best!

Marius

[fm]

Thanks, but I also wanted to keep the 'next' button - is there a way around this?

[fm]

So I managed to do it with this code here:

.flickity-prev-next-button.previous {
display: none !important;
}

What I am trying to do now is to make it applicable to only one of my carousels. Does anyone know how to do this? Would I have to add a custom class to the carousel? How would I insert that into the above code?

Thank you for the help :)

What I would also like to do is make another carousel unresponsive to clicking on its images (as opposed to it moving onto the next image when it is clicked, as it does currently). So it is more like a video slideshow of images in the background of the page. Any ideas on how to do this would be really appreciated.

[mariusjopen]

Hi @fm

ok. I try to help!

1. You can add a class to every element here:
   

.no-next .flickity-prev-next-button.previous {
display: none !important;
}

2. Add a class to the carousel as well called for example no-click.

.no-click .flickity-prev-next-button.previous {
pointer-events: none;
}

I did not test the code but I think it should work.

Best!

Marius