1

Друзья, как правильно вставить bxslider в popup?

Я думаю многие сталкивались уже с данной проблемой, так что, обойдемся без скринов :)

Я так понимаю проблема в этой строчке:

<div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 0px;">

Вопрос: как это исправить?

Вот код самого слайдера:

$('.popup_slider ul').bxSlider({ nextText:'', prevText:'', minSlides: 3, maxSlides: 3, slideWidth: 121, speed: 500, controls: true, pager: false });
1
  • Что-то ничего не понятно.
    – Skywave
    26 окт 2016 в 11:44

2 ответа 2

0

Проблема со стилями. У Вас слайдер обсчитывает в 0 высоту. ПО всей вероятности что-то не так со слайдами. Если делается не на локале, то дайте ссылку.

0
0

Слайдер инициализирует высоту по имеющимся высотам слайдов, т. е. когда происходит инициализация, у слайдов высота 0 пикселей, поскольку обрамляющий их попап обычно имеет display: none.

Решение: инициализировать слайдер после появления попапа, использовать коллбек, а после закрытия слайдер деинициализировать. Например, при использовании плагина для попапов bPopup:

var slider;

$('.popup').bPopup({
  onOpen: function() {
    slider = $('.slider').bxSlider();
  },
  onClose: function() {
   slider.destroySlider();
  }
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.