Пятничная карусель: кнопки внутри гладкой карусели, которые могут накладывать карусель?

Question

Поэтому в основном я хочу сделать что-то подобное с Slick ... Я хочу иметь нормальные слайды, но дело в том, что я хочу иметь призыв к действию (кнопки) в них. Обычно было бы легко просто поместить кнопки в слайды, но на карусели есть переполнение: скрытый стиль, который нельзя снять, пока не появятся другие слайды. Мне интересно, как я могу это достичь (кнопки слегка выходят наружу, не будучи отрезанным).

Edit: добавлена ​​граница для карусельного которая является истинной проблемой, что у меня есть ... поддержание границы и получения дна появляться перекрытия на границе

Answer 1

HTML

<div class="slick__slide-cta"> 
     <button>example</button> 
    </div> 
    </div> 
</div> 

.slick__slide-cta { 
    height: 40px; 
    margin-top: -20px; 
} 

Не совсем это, но идея заключалась бы в том, чтобы область CTA перекрывала изображение или что-то еще, сохраняя при этом общую высоту слайда. Трудно объяснить, было бы легче показать в скрипке.

Answer 2

Это может быть достигнуто путем добавления заполняющего дна к классу .slick-список так:

.myslider .slick-list { 
    padding-bottom: 15px; 
} 

Нижняя обивка будет значение точек половины вашей кнопки, которая в настоящее время накладываемой. Это работает, потому что увеличивает высоту контейнера .slick-list, на котором есть свойство overlay:hidden.