mobile autoplay fix

index.html

@@ -269,19 +269,16 @@ <h1 style="font-size: 2em;">Everything</h1>
 </style> 
 
 <!-- JavaScript for ensuring autoplay on mobile devices after user interaction -->
-<script>
-  function enableAutoplay() {
-    var videos = document.querySelectorAll('video[autoplay]');
-    videos.forEach(function(video) {
+document.addEventListener('DOMContentLoaded', function() {
+  var videos = document.querySelectorAll('video[autoplay]');
+  videos.forEach(function(video) {
+      video.muted = true; // Ensure the video is muted
       video.play().catch(function(error) {
-        console.log('Autoplay was prevented: ', error);
+          console.log('Autoplay was prevented: ', error);
       });
-    });
-  }
+  });
+});
 
-  document.body.addEventListener('touchstart', enableAutoplay, {once: true});
-  document.body.addEventListener('click', enableAutoplay, {once: true});
-</script>