FlexSlider. Как при изменении ширины окна браузера изменить maxItems?

Аватар пользователя marat M marat M 31 января 2018 в 12:44

Есть адаптивный слайдер. Всё бы хорошо, но надо бы "на лету" менять число показываемых в одном слайде элементов, если меняется разрешение окна браузера. Изначально в настройках выставлен maxItems равный 5.
Вот ссыль на сайт на тестовом домене rostov-official.ru (слайдер внизу на главной).
Средствами CSS уже всё перепробовано, не понравилось.

0 Thanks

Лучший ответ

Комментарии

Аватар пользователя ХулиGUN ХулиGUN 31 января 2018 в 14:35

Вот поэтому подобные плюшки должны решаться на стороне фронта, а не модулями. Вешается слушатель на ширину окна и при нужных значениях переинициализирует слайдер с нужными параметрами

Аватар пользователя marat M marat M 31 января 2018 в 17:15

Спасибо и за слик и за карусель, но на флекс уже потрачено много времени, он пашет в трех разных местах и менять не вариант.
Вопрос именно КАК переинициализировать слайдер? Я додумался только в html.tpl.php включить такое:

if ( $( window ).width() < 768 ) {
  $('.flex-authorsviewport').flexslider({
    maxItems: 4,
  });
}

событие отлавливается, но слайдер не отзывается...

Аватар пользователя ХулиGUN ХулиGUN 31 января 2018 в 17:59
marat M wrote:

Ага! А как изменить именно значение maxItems?

Я хз, никогда не пользовался. Посмотрите что приходит в data('flexslider')... можкт можно там засеттить maxitems, ну а потом выполнить ресайз

Аватар пользователя ХулиGUN ХулиGUN 31 января 2018 в 19:09

Покопался немного в консольке на Вашем сайте.

jQuery('#authors_slider').data('flexslider').vars.maxItems = 5  // Установка нужного значения maxItems
jQuery('#authors_slider').data('flexslider').update()  // Обновить настройки слайдера

Единственный косяк - они применяются только после клика влево/вправо
Для более подробной инфы нужно курить доку. Сорян, но мне за Вас это делать лениво

Аватар пользователя marat M marat M 31 января 2018 в 21:51

Не вышло... Даже ваши подсказки не заработали, как я над ними не изгалялся. И то, что нарыл на стаковере, тоже не пошло. Думаю дальше.

Аватар пользователя ХулиGUN ХулиGUN 2 февраля 2018 в 19:29
marat M wrote:

Всё еще в поисках решения, о братья по разуму. Проект горит.

Уже б давно попробовали либо другой модуль слайдера, либо вручную инициализировали/переинициализировали без модуля

Аватар пользователя gun_dose gun_dose 2 февраля 2018 в 19:48

Тебе же русским языком сказали - в флексслайдер уже вложено много человекочасов, поэтому нужно потратить ещё хотя бы неделю на решение проблемы, а не решать вопрос по-нормальному за 20 минут.

Аватар пользователя marat M marat M 2 февраля 2018 в 20:25
1

А что, азарт уже не в моде? Ничего, мои остроумные друзья, я таки найду решение и выложу его именно сюда.

Аватар пользователя fairrandir fairrandir 2 февраля 2018 в 23:16

Я как-то раз тоже с флексслайдером по этой теме мучался пару часов. А потом подумал - да я бы за это время уже на слик переделал. И переделал.

Аватар пользователя marat M marat M 3 февраля 2018 в 18:53

Некошерно, но сделано. В jquery.flexslider.js в функцию slider.doMath добавил условие:

if (window.innerWidth < 320) {
maxItems = 1;
} else if (window.innerWidth < 670) {
maxItems = 3;
} else {
maxItems = 5;
};

Работает. Если кто подскажет, как сделать то же истинно-друпально, будет вообще хорошо.
На будущее, конечно, флексслайдер идет в игнор за неподдержку точек слома. Совести нет никакой совсем.