.e-loop-item {
opacity: 0;
transform: translateY(40px);
transition: opacity 1.0s ease, transform 2.0s;
}
.e-loop-item.visible {
opacity: 1;
transform: translateY(0);
transition-delay: calc(var(--animation-order) * 0.3s);
}
document.addEventListener('DOMContentLoaded', function() {
let loopObserver = null;
function animateVisibleLoopItems() {
const items = document.querySelectorAll('.e-loop-item');
let order = 1;
items.forEach(item => {
item.classList.remove('visible');
if (item.offsetParent !== null) {
item.style.setProperty('--animation-order', order++);
setTimeout(() => {
item.classList.add('visible');
}, 50);
}
});
}
function observeLoopContainer() {
if (loopObserver) {
loopObserver.disconnect(); // Stop old observer
}
const firstItem = document.querySelector('.e-loop-item');
if (!firstItem) return;
const loopContainer = firstItem.parentElement;
if (!loopContainer) return;
loopObserver = new MutationObserver(function(mutationsList) {
let itemsChanged = false;
mutationsList.forEach(mutation => {
if (mutation.addedNodes.length > 0 || mutation.removedNodes.length > 0) {
itemsChanged = true;
}
});
if (itemsChanged) {
setTimeout(() => {
animateVisibleLoopItems();
}, 50);
}
});
loopObserver.observe(loopContainer, { childList: true });
}
animateVisibleLoopItems(); // Initial load
observeLoopContainer(); // Initial observe
// After filter click, wait, then re-attach observer
jQuery(function($) {
$(document).on('click', '.e-filter-item', function() {
setTimeout(function() {
animateVisibleLoopItems();
observeLoopContainer();
}, 400); // allow Elementor Ajax to complete
});
});
});
מוצרים חדשים
