oont/oont-contents
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

single product visiblity? version

Browse source
This commit is contained in:
nomadics9 2025-04-03 17:52:05 +03:00
parent 15400e93d6
commit 598040832e
1 changed files with 76 additions and 69 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

145
themes/oont-themev2/assets/js/product-slider.js
View file

@ -24,76 +24,83 @@
// }); // });
//}); //});
// //
jQuery(document).ready(function($) { //
if (window.location.pathname.startsWith('/product/')) return; //
//
$('.product-slider-container').each(function() {
const container = $(this);
const slider = container.find('.product-image-slider');
const items = slider.find('.slider-item');
let currentIndex = 0;
// Hide all except first
items.css({ position: 'absolute', opacity: 0, transition: 'opacity 0.3s ease' });
items.eq(currentIndex).css({ opacity: 1, position: 'relative' });
// Create and insert dots //
if (items.length <= 1) return; //jQuery(document).ready(function($) {
// if (window.location.pathname.startsWith('/product/')) return;
const dotsContainer = $('<div class="slider-dots"></div>'); //
// $('.product-slider-container').each(function() {
items.each(function(i) { // const container = $(this);
const dot = $('<span class="slider-dot"></span>'); // const slider = container.find('.product-image-slider');
if (i === 0) dot.addClass('active'); // const items = slider.find('.slider-item');
dot.on('click', function() { // let currentIndex = 0;
currentIndex = i; //
updateSlide(); // // Hide all except first
}); // items.css({ position: 'absolute', opacity: 0, transition: 'opacity 0.3s ease' });
dotsContainer.append(dot); // items.eq(currentIndex).css({ opacity: 1, position: 'relative' });
}); //
// // Create and insert dots
container.append(dotsContainer); // if (items.length <= 1) return;
//
// Slide update function // const dotsContainer = $('<div class="slider-dots"></div>');
function updateSlide() { //
items.css({ opacity: 0, position: 'absolute' }); // items.each(function(i) {
items.eq(currentIndex).css({ opacity: 1, position: 'relative' }); // const dot = $('<span class="slider-dot"></span>');
dotsContainer.find('.slider-dot').removeClass('active') // if (i === 0) dot.addClass('active');
.eq(currentIndex).addClass('active'); // dot.on('click', function() {
} // currentIndex = i;
// updateSlide();
// Touch swipe // });
let touchStartX = 0; // dotsContainer.append(dot);
let touchEndX = 0; // });
//
slider.on('touchstart', function(e) { // container.append(dotsContainer);
touchStartX = e.originalEvent.touches[0].clientX; //
}); // // Slide update function
// function updateSlide() {
slider.on('touchend', function(e) { // items.css({ opacity: 0, position: 'absolute' });
touchEndX = e.originalEvent.changedTouches[0].clientX; // items.eq(currentIndex).css({ opacity: 1, position: 'relative' });
const delta = touchEndX - touchStartX; // dotsContainer.find('.slider-dot').removeClass('active')
// .eq(currentIndex).addClass('active');
if (Math.abs(delta) > 50) { // }
if (delta < 0) { //
currentIndex = (currentIndex + 1) % items.length; // // Touch swipe
} else { // let touchStartX = 0;
currentIndex = (currentIndex - 1 + items.length) % items.length; // let touchEndX = 0;
} //
updateSlide(); // slider.on('touchstart', function(e) {
} // touchStartX = e.originalEvent.touches[0].clientX;
}); // });
//
// Optional: support prev/next buttons too // slider.on('touchend', function(e) {
container.find('.slider-prev').on('click', function() { // touchEndX = e.originalEvent.changedTouches[0].clientX;
currentIndex = (currentIndex - 1 + items.length) % items.length; // const delta = touchEndX - touchStartX;
updateSlide(); //
}); // if (Math.abs(delta) > 50) {
// if (delta < 0) {
container.find('.slider-next').on('click', function() { // currentIndex = (currentIndex + 1) % items.length;
currentIndex = (currentIndex + 1) % items.length; // } else {
updateSlide(); // currentIndex = (currentIndex - 1 + items.length) % items.length;
}); // }
}); // updateSlide();
}); // }
// });
//
// // Optional: support prev/next buttons too
// container.find('.slider-prev').on('click', function() {
// currentIndex = (currentIndex - 1 + items.length) % items.length;
// updateSlide();
// });
//
// container.find('.slider-next').on('click', function() {
// currentIndex = (currentIndex + 1) % items.length;
// updateSlide();
// });
// });
//});