45 lines
1.4 KiB
JavaScript
45 lines
1.4 KiB
JavaScript
/**
|
|
* AKSRT Product Archive — 商品归档页交互
|
|
*
|
|
* 处理商品分类/标签归档页的筛选、排序和加载更多。
|
|
*
|
|
* @package AKSRT
|
|
*/
|
|
|
|
(function () {
|
|
'use strict';
|
|
|
|
var grid = document.getElementById('aksrt-product-grid');
|
|
if (!grid) return;
|
|
|
|
// 商品卡片懒加载图片观察器
|
|
if ('IntersectionObserver' in window) {
|
|
var imgObserver = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (entry.isIntersecting) {
|
|
var img = entry.target;
|
|
if (img.dataset.src) {
|
|
img.src = img.dataset.src;
|
|
img.removeAttribute('data-src');
|
|
}
|
|
imgObserver.unobserve(img);
|
|
}
|
|
});
|
|
}, { rootMargin: '200px' });
|
|
|
|
grid.querySelectorAll('img[data-src]').forEach(function (img) {
|
|
imgObserver.observe(img);
|
|
});
|
|
}
|
|
|
|
// 商品卡片 hover 效果增强
|
|
grid.querySelectorAll('.aksrt-product-card').forEach(function (card) {
|
|
card.addEventListener('mouseenter', function () {
|
|
this.classList.add('aksrt-product-card--hover');
|
|
});
|
|
card.addEventListener('mouseleave', function () {
|
|
this.classList.remove('aksrt-product-card--hover');
|
|
});
|
|
});
|
|
})();
|