Ответы пользователя по тегу Bootstrap
  • Слайдер Bootstrap3 Почему при смене слайдов уменьшается высота слайдера?

    @Vadim1991 Автор вопроса
    <div class="container-fluid">
    <div id="myCarousel" class="carousel slide" data-ride="carousel"><!-- Carousel items -->
    <div class="carousel-inner">
    <div class="active item"><video autoplay="autoplay" muted="" width="1910" height="auto">
    <source src="https://omecmotors.ru/images/video/DvigNEW.mp4" type="video/mp4" /></video></div>
    <div class="item"><img class="d-block " src="https://omecmotors.ru/images/slide/OMEC-Banner-1210x400-0.jpg" width="100%" data-path="local-images:https://omecmotors.ru/images/slide/OMEC-Banner-1210x400-0.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/sklad-v-rf"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">СКЛАД В РФ</span></a></div>
    </div>
    <div class="item"><img class="d-block " src="https://omecmotors.ru/images/slide/OMEC-Banner2-1210x400-0.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/OMEC-Banner2-1210x400-0.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/omec-motors-prodolzhaet-rabotu"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">ВАЖНО</span></a></div>
    </div>
    <div class="item"><img class="d-block " src="https://omecmotors.ru/images/slide/products5-0-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/products5-0-1.jpg" />
    <p style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/catalog"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">ПРОДУКЦИЯ</span></a></p>
    </div>
    <div class="item"><img class="d-block " src="https://omecmotors.ru/images/slide/otrasli1210400-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/otrasli1210400-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/otrasli"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">ОТРАСЛИ</span></a></div>
    </div>
    <div class="item"><img class="d-block" src="https://omecmotors.ru/images/slide/clients2-0-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/clients2-0-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/klienty"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">КЛИЕНТЫ</span></a></div>
    </div>
    <div class="item"><img class="d-block" src="https://omecmotors.ru/images/slide/distributors3-0-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/distributors3-0-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/dilery"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">ДИЛЕРЫ</span></a></div>
    </div>
    <div class="item"><img class="d-block" src="https://omecmotors.ru/images/slide/about1-0-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/about1-0-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/o-nas"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">О НАС</span></a></div>
    </div>
    <div class="item"><img class="d-block" src="https://omecmotors.ru/images/slide/servis1210400-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/servis1210400-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/servis"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">СЕРВИС</span></a></div>
    </div>
    <div class="item"><img class="d-block" src="https://omecmotors.ru/images/slide/new1210400-1.jpg" width="100%" height="auto" data-path="local-images:https://omecmotors.ru/images/slide/new1210400-1.jpg" />
    <div style="position: absolute; z-index: 2; left: 80%; right: 0; top: 15%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); background: #091642; width: 20%; height: auto;"><a href="https://omecmotors.ru/o-nas/novosti"><span style="font-size: 32px; text-transform: uppercase; color: #fff; line-height: 1.5em; text-align: center;">НОВОСТИ</span></a></div>
    </div>
    </div>
    <!-- Carousel nav --> <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a> <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a></div>
    </div>
    Ответ написан
    Комментировать