Почему слайдер slick не адаптируется после изменения ориентации устройства?

Question

[dima_maketov]

Здравсвтуйте!

Есть сайт, на котором 2 слайдера slick jquery, отображается вроде адекватно на компьютере, но если зайти с мобильного устройства с портретной ориентацией, и далее сделать ее горизонтальной -вроде бы и тут все норм, но если вернуть обратно - адаптации не происходит, высота нижнего слайдера становиться такой, какой она была на ПК-версии, первый слайдер остается таким же каким был на ПК, но адаптирует только ширину экрана. Можете проверить через device toolbar в браузере, если Вы сделаете ширину экрана 415 - слайдеры будут отображаться криво, но если вы уменьшите размер, например, на 1 пиксель - слайдер адаптируется так как необходимо.
Вот код скриптов:

$('.slider__foods').slick({
    focusOnSelect: true,
    slidesToShow: 3,
    autoplay: true,
    autoplaySpeed: 2000,
    prevArrow: $('#section4 .go__back'),
    nextArrow: $('#section4 .go__next'),
    centerMode: true,
    autoplay: true,
    responsive: [
    {
      breakpoint: 480,
      settings: {
        speed: 300,
        autoplay: true,
        autoplaySpeed: 10000,
        centerMode: false,
        centerPadding: '0',
        slidesToShow: 1,
        variableWidth: false
      }
    }
    ]
    });
  $('.slider__atmosphere').slick({
    speed: 300,
    centerPadding: 35,
    autoplay: true,
    autoplaySpeed: 2000,
    slidesToShow: 4,
    centerMode: true,
    variableWidth: true,
    focusOnSelect: true,
    prevArrow: $('#section7 .go__back'),
    nextArrow: $('#section7 .go__next'),
    responsive: [
      {
        breakpoint: 480,
        settings: {
          speed: 300,
          autoplay: true,
          autoplaySpeed: 10000,
          centerMode: false,
          centerPadding: '0',
          slidesToShow: 1,
          variableWidth: false
        }
      }
    ]
  });

Comments

[Максим]

у меня вообще ваш сайт с телефона со скролом отображается , ни какой адаптации нету

[Сергей Горячев]

Банально, с мозилла дев не вижу вообще адаптации.
Соответственно, не вижу смысла искать проблему у слике.

[dima_maketov]

Сергей Горячев: на сайте 2 отображения: до 415 и после 415 пикселей. Тк дизайнер не подготовил версии для планшетной версии. 100% адаптации нету, на моем устройстве 360 пикс отображается нормально сайт.
Как я понимаю, решить проблему с адаптацией у слайдера не удасться пока не будет 100% адаптации?

[Алексей Скляров]

dima_maketov: не "не удастся", а решите сначала проблему с адаптацией всего сайта, а затем уже смотрите как поведет себя слик.

[Сергей Горячев]

dima_maketov: если дизайнеру пох на людей с телефонами 320 пикселей, это горе-дизайнер. Сначала решите проблему с адаптацией, а потом к слику придирайтесь.

Answer 1

[Полина Емельянова]

#description, #events, #header, #main__background, #map, #section4, #section5, #section7, .s_footer {
    width: 1024px;
}

Эм... Вы пошутили, да? У вас нет адаптива.