Карусель с изображениями разной ширины и разного пробела - как добиться однородности?

Question

У меня есть гладкая карусель, на которой отображаются логотипы компаний. Некоторые логотипы прямоугольные, некоторые квадратные. Гладкая карусель настроена на показ четырех логотипов одновременно. В настоящее время квадратные логотипы имеют пустое пространство вокруг, так что их слайд занимает 25% ширины карусели, но я хочу устранить этот пробел. Я просто не могу обдумать, как это сделать, сохраняя при этом отзывчивый аспект вещей.

Вы можете видеть, что я имею в виду на прикрепленном примере изображения. Как сделать так, чтобы был достигнут желаемый результат? Спасибо!

Answer 1

Документы Slick Carousel имеют информацию по этому вопросу здесь: http://kenwheeler.github.io/slick/ немного вниз по странице.

Это дает пример вызова карусели, но variableWidth должен быть кикером:

$('.variable-width').slick({
  dots: true,
  infinite: true,
  speed: 300,
  slidesToShow: 1,
  centerMode: true,
  variableWidth: true
});