test

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();
+                                    });
+                                }          
                             }
                         }                        
                     }