vladimirow
Пользователь
- Регистрация
- 30.08.15
- Сообщения
- 2
- Реакции
- 0
- Баллы
- 1
Привет, гуру!
Я настоящий нуб в js, поэтому надеюсь, что найду рабочее решение моей проблемы. Я работаю над проектом Drupal 7 на основе шаблона Porto v.2.1 с использованием модуля Dupal Commerce. Я реализовал Owl Carousel 2 версии 2.1.0 с jQuery 1.12.3.
На странице отображения продукта у меня есть несколько виджетов атрибутов, которые представляют собой карусели. Все мои элементы карусели кликабельны (атрибуты продукта, которые загружают большое изображение модели со связанными атрибутами с помощью вызовов Ajax). В одном виджете более 30 элементов (моделей, которые являются терминами таксономии), сейчас в нем всего 14 элементов. Поэтому я вызываю плагин карусели виджета (div) со следующим кодом:
Код (JavaScript): И вот как это выглядит:
Поэтому, когда вы переходите, например, к последнему элементу, который не виден при первой загрузке страницы, и нажимаете на этот элемент, карусель переключается в положение по умолчанию, и выбранный элемент становится невидимым, но я хочу, чтобы карусель оставалась после щелчка в том же положении. прежде чем нажать.
Все эти цветные квадраты ниже также являются каруселями, которые представляют такие атрибуты продукта, как цвет двери, цвет стекла и т. д., поэтому эти карусели должны сохранять свои текущие позиции после щелчка по их элементам.
Есть ли возможность сделать это, изменив мой js-код? Все соответствующие примеры очень ценятся!
Кроме того, я хочу, чтобы работало то, что когда вы нажимаете на карусель среднего + 1 элемента, она должна перемещаться вперед для одного элемента, когда вы нажимаете на среднюю + 2 карусель элементов, она должна перемещаться вперед для двух элементов, то же самое для +3 и +4. И карусель должна иметь возможность двигаться назад после нажатия на элементы среднего-1, среднего элемента-2 и т. д.
Очень надеюсь получить реальные примеры того, как я могу выполнить всю эту работу, потому что мои знания не позволяют мне сделать это самостоятельно.
Заранее спасибо,
Илья
Я настоящий нуб в js, поэтому надеюсь, что найду рабочее решение моей проблемы. Я работаю над проектом Drupal 7 на основе шаблона Porto v.2.1 с использованием модуля Dupal Commerce. Я реализовал Owl Carousel 2 версии 2.1.0 с jQuery 1.12.3.
На странице отображения продукта у меня есть несколько виджетов атрибутов, которые представляют собой карусели. Все мои элементы карусели кликабельны (атрибуты продукта, которые загружают большое изображение модели со связанными атрибутами с помощью вызовов Ajax). В одном виджете более 30 элементов (моделей, которые являются терминами таксономии), сейчас в нем всего 14 элементов. Поэтому я вызываю плагин карусели виджета (div) со следующим кодом:
Код:
(function($) { Drupal.behaviors.myBehavior = { attach: function (context) { $('.attribute-widgets > div > div ').addClass("owl-carousel"); $('.attribute-widgets > div > div ').addClass("owl-theme"); var owl = $('.owl-carousel'); owl.owlCarousel({ dots: false, margin: 10, autoWidth: false, responsive:{ 640:{ items:3, nav: true, navText: "", }, 768:{ items:4, nav: true, navText: "", }, 1024:{ items:7, nav: true, navText: "", }, 1280:{ items:9, nav: true, navText: "", }, 1366:{ items:10, nav: true, navText: "", }, 1600:{ items:13, nav: true, navText: "", }, } }); } };
})(jQuery);
Поэтому, когда вы переходите, например, к последнему элементу, который не виден при первой загрузке страницы, и нажимаете на этот элемент, карусель переключается в положение по умолчанию, и выбранный элемент становится невидимым, но я хочу, чтобы карусель оставалась после щелчка в том же положении. прежде чем нажать.
Все эти цветные квадраты ниже также являются каруселями, которые представляют такие атрибуты продукта, как цвет двери, цвет стекла и т. д., поэтому эти карусели должны сохранять свои текущие позиции после щелчка по их элементам.
Есть ли возможность сделать это, изменив мой js-код? Все соответствующие примеры очень ценятся!
Кроме того, я хочу, чтобы работало то, что когда вы нажимаете на карусель среднего + 1 элемента, она должна перемещаться вперед для одного элемента, когда вы нажимаете на среднюю + 2 карусель элементов, она должна перемещаться вперед для двух элементов, то же самое для +3 и +4. И карусель должна иметь возможность двигаться назад после нажатия на элементы среднего-1, среднего элемента-2 и т. д.
Очень надеюсь получить реальные примеры того, как я могу выполнить всю эту работу, потому что мои знания не позволяют мне сделать это самостоятельно.
Заранее спасибо,
Илья