Update index.html

index.html

@@ -98,10 +98,12 @@
   </h1>
 </div>
 
-<div id="spider" class="spider">😘❤️</div>
+<div id="spider" class="spider">🕷️❤️</div>
+<audio id="bg-music" src="music.mp3" autoplay loop hidden></audio>
 
 <script>
   const spider = document.getElementById('spider');
+  const music = document.getElementById('bg-music');
   let mouseX = window.innerWidth / 2;
   let mouseY = window.innerHeight / 2;
   let spiderX = mouseX, spiderY = mouseY;
@@ -128,6 +130,25 @@
     spiderY = e.clientY;
   });
 
+  document.addEventListener('touchmove', (e) => {
+    const touch = e.touches[0];
+    mouseX = touch.clientX;
+    mouseY = touch.clientY;
+    createHeart(mouseX, mouseY);
+  });
+
+  document.addEventListener('touchstart', (e) => {
+    const touch = e.touches[0];
+    createHeart(touch.clientX, touch.clientY);
+    spiderX = touch.clientX;
+    spiderY = touch.clientY;
+  });
+
+  // Bypass autoplay block
+  document.addEventListener('click', () => {
+    music.play();
+  }, { once: true });
+
   function moveSpider() {
     const dx = mouseX - spiderX;
     const dy = mouseY - spiderY;