search

contao-components / swipe

JavaScript touch slider with additional dot menu
5 stars 2 forks source link

Disable or hide prev/next buttons when at begining or end #7

Closed Flo-JB closed 1 year ago

Flo-JB commented 2 years ago

It would be a great addition if the script could just add additional classes to the prev/next buttons if the start/end positions are reached to hide or disable them via css if needed (In non continuous mode).

With the actual implementation the user can click the buttons and nothing happens. With only one slide in the collection the buttons are completly useless right now.

I can help with that and create a pull request with this changes but maybe keep this open for discussion first - additionally I'm not sure what plans you have for swipe.js in Contao 5...

0xhtml commented 1 year ago

Using the experimental :has() pseudo-class (https://developer.mozilla.org/en-US/docs/Web/CSS/:has), this CSS accomplishes hiding the prev und next link in Chrome but doesn't work in Firefox right now.

.slider-prev:has(+ .slider-menu > .active:first-child) {
    display: none;
}
.slider-menu:has(> .active:last-child) + .slider-next {
    display: none;
}

Though the implementation in CSS is a bit janky. Therefore, I would second that there should be a class added to the elements.

leofeyer commented 1 year ago

I can help with that and create a pull request with this changes

I would appreciate that very much. 👍

Flo-JB commented 1 year ago

See #9