Как исправить ширину owl carousel?

Question

[Михаил Литвинов]

Всем привет! Такой вопрос: при ширине экрана в 1920px карусель задает ширину слайда в 1903, из-за чего картинка обрезается за 17 пикселей: как это исправить? одно дело, когда используется стандартный скролл бар, ошибки не видно, но если ставить кастомный тонкий скроллбар, то это уже проблема.

Comments

[IIIu6ko]

Выстави для img width: 100%

[Михаил Литвинов]

IIIu6ko, стоит

[IIIu6ko]

Михаил Литвинов, Без примера сложно что-то сказать.

[Михаил Литвинов]

IIIu6ko, а какой именно пример нужен?

$(document).ready(function(){
    $('.owl-carousel').owlCarousel({
        loop:true,
        autoplay:true,
        smartSpeed:1000,
        autoplayTimeout:8000,
        nav:true,
        tauchDrag:true,
        items:1,
        dots:false,
        navtext:false
    });
    });

вот вызов карусели, в css везде стоит 100%

[IIIu6ko]

Михаил Литвинов, Живой пример, чтобы можно было посмотреть в браузере.
Попробуй сделать пример на https://codepen.io, либо выгрузи сайт на хостинг и кинь ссылку.

[Михаил Литвинов]

IIIu6ko, Вот, выгрузил на хост

[Михаил Литвинов]

IIIu6ko, там надо в адресной строке удалить /home и все загрузится

[IIIu6ko]

Михаил Литвинов, В хроме слайдер вообще не грузиться, а в firefox ширина в норме.
Скорее всего проблема в кастомном скролле. Какой используешь?

Попробуй при ините скролла обновлять ширину слайдера.

const owl = $('.owl-carousel').owlCarousel({
  loop:true,
  autoplay:true,
  smartSpeed:1000,
  autoplayTimeout:8000,
  nav:true,
  tauchDrag:true,
  items:1,
  dots:false,
  navtext:false
});

owl.trigger('resize.owl.carousel');

[Михаил Литвинов]

IIIu6ko, скролл использовал обычный, но когда поставил кастомный - проблема исчезла. По какой-то причине, там создается отступ для скроллбара, независимо от его наличия, если его не отключить...

Answer 1

[Михаил Литвинов]

проблема решается установкой в body overflow-x: hidden;