Вопросы Теги

Bootstrap 4 Вертикальный слайдер [дубликат]

Для любого, кто смотрит этот ответ в будущем, HTML5 реализует новый атрибут для элементов формы hidden, который автоматически применит display:none к вашему элементу.

например 

<input type="submit" hidden />
3
задан ben.kaminski 20 March 2017 в 18:24
поделиться

1 ответ

Обновлено 2018 для Bootstrap 4.0.0

Переходы анимации Bootstrap 4 используют transform, поэтому я думаю, что было бы лучше использовать translate для изменения ориентации по вертикали и положению каждого слайда ...

Демо: http://www.codeply.com/go/PgxKT3h6x6 

.vert .carousel-item-next.carousel-item-left,
.vert .carousel-item-prev.carousel-item-right {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.vert .carousel-item-next,
.vert .active.carousel-item-right {
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100% 0);
}

.vert .carousel-item-prev,
.vert .active.carousel-item-left {
-webkit-transform: translate3d(0,-100%, 0);
        transform: translate3d(0,-100%, 0);
}

Вертикальная карусельная демонстрация

6
ответ дан Themes.guide 16 August 2018 в 11:27
поделиться