diff --git a/snippets/shx-product-desc.liquid b/snippets/shx-product-desc.liquid index dbe496a..06c0cb4 100644 --- a/snippets/shx-product-desc.liquid +++ b/snippets/shx-product-desc.liquid @@ -57,23 +57,36 @@ let videoElement = this.querySelector('.shx-video'); videoElement.classList.add('shx-video-for-desc'); - if(openAnimation) { - + // pause all video + this.videoClones.keys().forEach((key) => { + if (key !== this.currentVariant) { + this.videoClones[key].pause(); + } + }); + videoClone.play(); + + if(openAnimation) { videoElement.style.height = '0px'; - - //animejs fade in - //dom ready - document.addEventListener('DOMContentLoaded', function() { + + function animate() { anime({ targets: videoElement, height: '400px', duration: 500, easing: 'cubicBezier(0.590, 0.190, 0.050, 0.990)' }); + } - console.log('open animation'); - }); + //animejs fade in + //dom ready + if (document.readyState !== 'loading') { + animate(); + } else { + document.addEventListener('DOMContentLoaded', function() { + animate(); + }); + } } } }