Bootstrap Carousel IE11
Карусель работает прекрасно во всех других браузерах. Работала и в IE до того, как была изменена длительность транзишена, однако теперь, при удалении всех добавленных к исходному коду строк, ситуация не меняется и карусель не работает.
Сама карусель <div class="container cont-carousel hidden-xs hidden-sm"> <div id="main" class="carousel slide" data-ride="carousel" data-interval="5000"> <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="images/slide1.jpg" alt=""> <div class="carousel-caption"> <h2 class="h-slide">Юридическая фирма «Альтаир»</h2> <p class="p-slide">Юридическая фирма «Альтаир» ведет свою деятельность с 1996 года. Накопленный нами многолетний практический опыт позволил стать нам одной из ведущих юридических компаний Харькова и надежным партнером малого, среднего и крупного бизнеса нашего города и Харьковской области.</p> </div> </div> <div class="item"> <img src="images/slide1.jpg" alt=""> <div class="carousel-caption"> <h2 class="h-slide">Юридическая фирма «Альтаир»</h2> <p class="p-slide">Юридическая фирма «Альтаир» ведет свою деятельность с 1996 года. Накопленный нами многолетний практический опыт позволил стать нам одной из ведущих юридических компаний Харькова и надежным партнером малого, среднего и крупного бизнеса нашего города и Харьковской области.</p> </div> </div> <div class="item"> <img src="images/slide1.jpg" alt=""> <div class="carousel-caption"> <h2 class="h-slide">Юридическая фирма «Альтаир»</h2> <p class="p-slide">Юридическая фирма «Альтаир» ведет свою деятельность с 1996 года. Накопленный нами многолетний практический опыт позволил стать нам одной из ведущих юридических компаний Харькова и надежным партнером малого, среднего и крупного бизнеса нашего города и Харьковской области.</p> </div> </div> </div> <a class="left carousel-control" href="#main" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#main" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> <span class="sr-only">Next</span> </a> </div> </div> Заказчики хотели видеть более плавное перелистывание слайдов, поэтому я повысила время транзишена с .6 до 1.5 секунд .carousel-inner>.item { -webkit-transition: -webkit-transform 1.5s ease-in-out; -o-transition: -o-transform 1.5s ease-in-out; transition: transform 1.5s ease-in-out; } Для того, чтобы исправить проблему с преждевременно исчезающим предшествующим слайдом, добавила $(document).ready(function() { jQuery.fn.carousel.Constructor.TRANSITION_DURATION = 1500 }); Конечно, эти шаги решили все для Chrome, Firefox и Opera. Очень прошу о помощи, так как редко сталкиваюсь с проблемами, связанными с кроссбраузерностью и не могу самостоятельно понять, как исправить эту ошибку. Увидеть слайдер можно здесь |
antegria,
попробуйте вот такой танец с бубнами .carousel-inner>.item { -webkit-transition: -webkit-transform 1.5s ease-in-out; -o-transition: -o-transform 1.5s ease-in-out; transition: transform 1.5s ease-in-out; *!* -ms-transition: left 1.4s ease-in-out; */!* } |
Часовой пояс GMT +3, время: 01:11. |