Как сделать кнопки в одной строке слайдером?

Question

[Алекс]

Необходимо сделать панель (на размерах экранов под мобилки и планшеты), в которой будут 2 или больше кнопок, левая кнопка прижата к левому краю, а самая правая к правому. Если листаем вперед то торчит следующая на половину (именно половина, должна быть надпись видна частично), как только дошли до конца начинают торчать кнопки справа

Реализовал небольшой пример с использованием slick слайдера


Но мне не нравится это по ряду причин:

1. после инициализации сразу не понятно что это слайдер так как кнопка растянута полностью и не работает отступ справа(нужно дернуть его рукой разок чтобы запустить)
   
2. после долистывания до конца не придумал ничего лучше чем менять класс у списка, добавления отступа, но тут теперь это подергивания после долистывания (смягчил как мог transition'ом, но как избавиться от него впринципе)
   

Comments

[Максим Тимофеев]

после инициализации сразу не понятно что это слайдер

для этого показывают сразу элементы управления и/или делают автостарт

[Алекс]

Максим Тимофеев, мне не нужны стрелки и тд и тп, как и автопрокрутку. Задачу я вроде описал что нужно вот такое только либо по другому более корректно реализовано, либо подсказка как это добить. Это просто ряд кнопок при клике на которые происходит скролл по якорю

Answer 1

[FeST1VaL]

Как вариант есть плагин Scroller, он очень прост...
А чтобы выстроить блоки по краям, то можно использовать flexbox с justify-content: space-between;

выглядит примерно так skrinshoter.ru/v/060219/mt27A58f.mp4

Comments

[Алекс]

Похоже на то, что нужно. Благодарю!