Всем привет!
Подключил слайдер Slick с изображениями. Fancybox открывает изображения при нажатии на кнопку, а не на само изображение.
У каждой ссылки с изображением прописан data-order с нумерацией от 1 до 5.
При перелистывании слайдера, кнопке передаётся значение data-order от текущего открытого изображения слайдера и задаётся индексом в $fancybox.open. Благодаря этому, при нажатии на кнопку, в fancybox открывается изображение с указанным index, которое необходимо открыть.
Всё отлично срабатывает, открывается нужное изображение, но при закрытии fancybox, листаю в слайдере до другого изображения, нажимаю на кнопку и мне открывается изображение из предыдущего индекса.
В fancybox есть настройка срабатывания события после закрытия слайдера – afterClose, но нигде не могу найти информацию, как сбросить или обновить значение index.
Буду благодарен за любые идеи!
Весь код со слайдером загрузил на Jsfiddle
Ниже часть кода вызывающая fancybox.
// сортировка массива объектов по свойству
let sortObjectsBy = function(field, reverse, primer) {
let key = primer ? function(x) {
return primer(x[field])
} : function(x) {
return x[field]
};
reverse = !reverse ? 1 : -1;
return function(a, b) {
return a = key(a),
b = key(b),
reverse * ((a > b) - (b > a));
}
}
jQuery('#wcOpenFullPhoto').on('click', function(e) {
var fancyElements = [];
e.preventDefault();
// создание массива объектов fancybox
jQuery('.product-gallery__item a').each(function(index) {
var el = jQuery(this).get(0),
order = jQuery(this).data("order");
fancyElements.push({
src: el.href,
caption: el.title,
order: order
});
});
// сортировка массива объектов fancybox по свойству "order"
fancyElements.sort(sortObjectsBy("order", false, function(a) {
return a;
}));
// запуск fancybox программно
jQuery.fancybox.open(
fancyElements, {
// пользовательские опции
loop: false,
afterClose: function() {
}
},
jQuery("#wcOpenFullPhoto").data("order") - 1 // запустить галерею из выбранного индекса
);
});
Получил ответ на другом форуме. Настройка afterClose не понадобилась, я совсем не в ту сторону копал.
var fancyElements = jQuery.map(jQuery('.product-gallery__item a'), function(el) {
return{
src: el.href,
caption: el.title
}
});
jQuery(".product-gallery__wrapper").slick({
slidesToShow: 1,
slidesToScroll: 1,
infinite: false,
centerMode: false,
focusOnSelect: true,
asNavFor: '.gallery-thambnails'
});
// Highlight thumbnail if large image is the same
jQuery(".gallery-thambnails").on("afterChange", function(event, slick, currentSlide, nextSlide) {
// remove all active class
jQuery(".gallery-thambnails .slick-slide").removeClass("slick-current");
// set active class for current slide
jQuery(".gallery-thambnails .slick-slide:not(.slick-cloned)").eq(currentSlide).addClass("slick-current");
jQuery("#wcOpenFullPhoto").data("order", currentSlide);
});
jQuery(".gallery-thambnails").slick({
slidesToShow: 4,
slidesToScroll: 1,
infinite: false,
dots: false,
centerMode: false,
focusOnSelect: true,
asNavFor: '.product-gallery__wrapper'
});
jQuery('#wcOpenFullPhoto').on('click', function(e) {
e.preventDefault();
jQuery.fancybox.open(
fancyElements, {
// Custom options
loop: false,
},
jQuery("#wcOpenFullPhoto").data("order") // Start gallery from selected index
);
});
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Подскажите, пожалуйста, где у меня ошибка? При попытке отправить письмо выдает "Произошла ошибка!" и письмо не отправляетсяБлагодарю за помощь!
Есть код, который проходится по заказам и получает суммы за определенный периодСейчас 3 периода
Кто может подсказать в чем причина? Когда нажимаю кнопку отправить, полученное значение становится NaN