I have added a custom scrollbar to the draggable Flickity Slider, but when it is being dragged to scroll the entire Flickity viewport moves instead of just the sider. Same thing when the previous-next buttons are pressed.
I would like to get some help to solve this.
Here’s my shop link: https://the-spec-shop-my.myshopify.com/
Enter using password: thespecshopisking
Hi @colinashvin ,
I really don’t understand your request.
Are you referring to the scroll bar below the section not working well?
I need to understand the request well so that I can best help you deal with it. Because I checked, scroll bar and dragging won’t work together.
Hope it helps!
Yes @LitExtension . The scrollbar and the drag doesn’t work together. As well as the slider navigation buttons. When I press on it it won’t scroll together with the scrollbar.
Hi @colinashvin ,
Like the previous answer, if you want the slider to work, you need to remove the scroll bar, both can’t work together.
You need to remove this code, the slider will work fine:
Hope it is clear to you.
If it helped you solve your issue, please mark it as a solution. Thank you and good luck.
@LitExtension I want the slider to work with the scrollbar. I styled the scrollbar. Is there a way for that to work?
Hi @colinashvin ,
This is impossible. Because flickity-slider is working with ‘transform’ and flickity-viewport is being shown ‘overflow: hidden’ for slider to work.
Or you can just add ‘overflow-x:auto’ for .flickity-viewport, but i think it’s not really good.
Hope it is clear to you.
