Проблема с каруселью на сайте

Есть сайт на MODX EVO.
На нем карусель товаров.
Если товаров в категории мало – 1,2,3,4 – они некорректно отображаются.
Если больше – все нормально.
5 товаров – joxi.ru/8AnW33kCQgBRrO
4 товара – joxi.ru/xAeE88Ktna04Ay.
3 товара – также
2 товара – joxi.ru/5mdoGGLhOZxkr1
1 товар – также
6 и более -нормально
Может кто помочь с проблемой?
Заранее спасибо.

Андрей

19 октября 2016, 09:39

3 404

Комментарии: 14

Евгений Webinmd Эксперт

19 октября 2016, 14:34

Какой скрипт, как вызывается? есть ли пример?

Андрей Старожил

19 октября 2016, 14:49

Могу ссылку на сайт дать

Евгений Webinmd Эксперт

19 октября 2016, 15:11

было бы не плохо

Андрей Старожил

19 октября 2016, 15:14

2 товара — не показывает www.tehland.ru/katalog/ofisnaya-mebel/mebel-dlya-peregovornyix/alba.html
3 товара — сжато www.tehland.ru/katalog/ofisnaya-mebel/mebel-dlya-peregovornyix/boston.html
8 товаров — норм www.tehland.ru/katalog/ofisnaya-mebel/mebel-dlya-peregovornyix/shen-zhen.html

Евгений Webinmd Эксперт

19 октября 2016, 15:59

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

TITAN-UZ Проверенный

19 октября 2016, 17:54

Работает без проблем

Дмитрий Меркурьев Проверенный

19 октября 2016, 19:04

Попробуйте убрать row-flex у контейнера, воpможно flex мешает. У меня slick работает во многих местах без проблем.

Андрей Старожил

20 октября 2016, 13:58

не помогло

Дмитрий Меркурьев Проверенный

20 октября 2016, 14:11

А вызов slick как выглядит?
Для примера вызов в одном из проектов:

var $slickSlider = $('#slick-slider');
if ($slickSlider.length > 0){
	$slickSlider.slick({
		dots: true,
		speed: 300,
		slidesToShow: 4,
		slidesToScroll: 4,
		responsive: [
			{
				breakpoint: 1400,
				settings: {
					slidesToShow: 3,
					slidesToScroll: 3
				}
			},{
				breakpoint: 1168,
				settings: {
					slidesToShow: 2,
					slidesToScroll: 2
				}
			},{
				breakpoint: 900,
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1
			}
			},{
				breakpoint: 768,
				settings: {
					slidesToShow: 2,
					slidesToScroll: 2
				}
			},{
				breakpoint: 560,
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1
				}
			}
		]
	});
}

Андрей Старожил

20 октября 2016, 16:08

У меня не slick слайдер

Дмитрий Меркурьев Проверенный

20 октября 2016, 16:25

Это из вашего js

$(".carousel-products-relative").slick({ ...

А это кусок разметки:

Андрей Старожил

21 октября 2016, 09:22

Убрать row-flex не помогло

Андрей Старожил

24 октября 2016, 09:25

Спасибо всем. проблема решена

Игорь Старожил

18 ноября 2018, 19:06

А как решили? поделитесь серетом

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

Проблема с каруселью на сайте

Job Piper собирает IT заказы со всего Интернета.

Комментарии: 14