Перейти к содержимому


Исправление Js-Ошибки И Скорллинга При Перелистывании Сопутствующих Товаров


  • Авторизуйтесь для ответа в теме
В этой теме нет ответов

#1 metry

metry

    Активный участник

  • Модераторы
  • 884 сообщений

Отправлено 15 Декабрь 2020 - 18:33

Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.navigation .prev, .navigation .next, .owl-nav .owl-prev, .owl-nav .owl-next {display: block;background-color: #fff;color: #a7a7a7;font-size: 50px;width: 50px;height: 50px;line-height: 50px;font-family: "Material Icons";margin: 0;padding: 0;overflow: hidden;text-align: center;cursor: pointer;z-index: 2;}

замените на:

.navigation .prev, .navigation .next, .owl-nav .owl-prev, .owl-nav .owl-next {display: block;background-color: #fff;color: #a7a7a7;font-size: 50px;width: 50px;height: 50px;line-height: 50px;font-family: "Material Icons";margin: 0;padding: 0;overflow: hidden;text-align: center;cursor: pointer;z-index: 2;border: 0;outline: 0;}

далее найдите:

/*** Сопутствующие товары, С этим товаром смотрят ***/
#related {position: relative;background-color: #fff;padding: 30px 0;}
#related .products-grid .item {padding: 0;}

после него вставьте:

#related .block-title {position: relative;}
#related .navigation .owl-prev, #related .navigation .owl-next {position: absolute;top: 0;}

Далее зайдите в Редактор шаблонов-->main.js  и найдите:

// С этим товаром смотрят
jQuery(function($) {
var owl = $('.related-views .products-grid');
// Показывать\Скрывать навигацию
owl.on('initialized.owl.carousel changed.owl.carousel', function(event) {
var items = event.item.count;
var size = event.page.size;
if (items < size){
	 $('.related-views .navigation').hide();
} else {
	 $('.related-views .navigation').show();
}
});
owl.owlCarousel({
items: 4,
margin: 30,
loop: false,
rewind: true,
lazyLoad: false,
dots: false,
nav: false,
navContainer: '.related-views .navigation',
navText: [ , ],
autoplay: true,
autoplayHoverPause: true,
smartSpeed: 500,
mouseDrag: true,
touchDrag: true,
pullDrag: true,
responsiveClass: true,
responsiveRefreshRate: 100,
responsive: {
	 0:{items:1},
	 320:{items:1},
	 480:{items:1},
	 641:{items:2},
	 768:{items:2},
	 992:{items:3},
	 1200:{items:3},
	 1366:{items:4}
}
});
// Кнопки навигации
$('.related-views .navigation .next').click(function(event) {
event.preventDefault();
owl.trigger('next.owl.carousel');
});
$('.related-views .navigation .prev').click(function(event) {
event.preventDefault();
owl.trigger('prev.owl.carousel');
});
});
// Сопутствующие товары
jQuery(function($) {
var owl = $('.related-goods .products-grid');
// Показывать\Скрывать навигацию
owl.on('initialized.owl.carousel changed.owl.carousel', function(event) {
var items = event.item.count;
var size = event.page.size;
if (items < size){
	 $('.related-goods .navigation').hide();
} else {
	 $('.related-goods .navigation').show();
}
});
owl.owlCarousel({
items: 4,
margin: 30,
loop: false,
rewind: true,
lazyLoad: false,
nav: false,
navContainer: '.related-goods .navigation',
navText: [ , ],
dots: false,
autoplay: true,
autoplayHoverPause: true,
smartSpeed: 500,
mouseDrag: true,
touchDrag: true,
pullDrag: true,
responsiveClass: true,
responsiveRefreshRate: 100,
responsive: {
	 0:{items:1},
	 320:{items:1},
	 480:{items:1},
	 641:{items:2},
	 768:{items:2},
	 992:{items:3},
	 1200:{items:3},
	 1366:{items:4}
}
});
// Кнопки навигации
$('.related-goods .navigation .next').click(function(event) {
event.preventDefault();
owl.trigger('next.owl.carousel');
});
$('.related-goods .navigation .prev').click(function(event) {
event.preventDefault();
owl.trigger('prev.owl.carousel');
});
});
}

замените на:

// С этим товаром смотрят
$('.related-views .owl-carousel').owlCarousel({
items: 5,
margin: 32,
loop: false,
rewind: true,
loop: false,
rewind: true,
lazyLoad: true,
nav: true,
navContainer: '.related-views .navigation',
navText: [ , ],
dots: false,
autoHeight: false,
autoHeightClass: 'owl-height',
autoplay: false,
autoplayHoverPause: false,
smartSpeed: 500,
mouseDrag: true,
touchDrag: true,
pullDrag: true,
responsiveClass: true,
responsiveRefreshRate: 100,
responsive: {
	 0:{items:1},
	 320:{items:1},
	 480:{items:1},
	 641:{items:2},
	 768:{items:2},
	 992:{items:3},
	 1200:{items:3},
	 1366:{items:4}
}
});
// Сопутствующие товары Слайдер
$('.related-goods .owl-carousel').owlCarousel({
items: 4,
margin: 32,
loop: false,
rewind: true,
lazyLoad: true,
nav: true,
navContainer: '.related-goods .navigation',
navText: [ , ],
dots: false,
autoHeight: false,
autoHeightClass: 'owl-height',
autoplay: false,
autoplayHoverPause: false,
smartSpeed: 500,
mouseDrag: true,
touchDrag: true,
pullDrag: true,
responsiveClass: true,
responsiveRefreshRate: 100,
responsive: {
	 0:{items:1},
	 320:{items:1},
	 480:{items:1},
	 641:{items:2},
	 768:{items:2},
	 992:{items:3},
	 1200:{items:3},
	 1366:{items:4}
}
});
}





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных