@vvzakharov
web-developer

Как в Slick slider сделать вертикальный слайдер с фиксированной высотой и выравниванию по центру?

Есть код:
<div class="modal-slider" id="modal-42">
		<div class="owl-over-item">
			<div class="owl-over-item-1">
				<div class="mod-slide" >
					<div class="mod-slide-img">
						<img data-src="/upload/iblock/d12/d122cca2ee524a700776291fcc20db53.JPG">
					</div>
				</div>
			</div>
		</div>
		<div class="owl-over-item">
				<div class="owl-over-item-1">
					<div class="mod-slide" >
						<div class="mod-slide-img">
							
							<img data-src="/upload/iblock/8fb/8fb6fd9276ef323d34b235185994074d.JPG">
						</div>
					</div>
				</div>
			</div><div class="owl-over-item">
				<div class="owl-over-item-1">
					<div class="mod-slide" >
						<div class="mod-slide-img">
							
							<img data-src="/upload/iblock/b31/b3133a778db3671bec199d9d158837fa.JPG">
						</div>
					</div>
				</div>
			</div><div class="owl-over-item">
				<div class="owl-over-item-1">
					<div class="mod-slide" >
						<div class="mod-slide-img">
							
							<img data-src="/upload/iblock/06c/06cb45c5507c9176fc85df4c1ccd0f13.JPG">
						</div>
					</div>
				</div>
			</div><div class="owl-over-item">
				<div class="owl-over-item-1">
					<div class="mod-slide" >
						<div class="mod-slide-img">
							
							<img data-src="/upload/iblock/6cd/6cd781009317b8f7ac55dd5cb1b82d30.JPG">
						</div>
					</div>
				</div>
			</div><div class="owl-over-item">
				<div class="owl-over-item-1">
					<div class="mod-slide" >
						<div class="mod-slide-img">
							
							<img data-src="/upload/iblock/49e/49e775e9c1895a711f6e247f43668371.JPG">
						</div>
					</div>
				</div>
			</div>
		</div>


Есть функция:

var orientation_vertical = (
        $(window).width() > $(window).height()
            ?false:true
    );
  carusel.slick({
                   
                           centerMode:true,
                            arrows: false,
                            infinite:false,
                            slidesToShow: 1,
                
                            adaptiveHeight:true,
                            variableWidth: (orientation_vertical?false:true),
                            verticalSwiping:(orientation_vertical?true:false),
                            vertical:orientation_vertical
                        });


В зависимости от ориентации экрана подстраивается ориентация слайдера.

В горизонтальном слайдере все проиходит корректно:
Слайдер во всю ширину и высоту экрана
Каждый слайд по центру экрана

В вертикальном слайдере всё летит
Высота слайдера зависит от слайдов
Слайды не по центру экрана

Как привести в порядов вертикальный слайдер?
  • Вопрос задан
  • 3186 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы