fixed issue with audio

index.html

@@ -43,10 +43,10 @@
       <div class="col-md-12">
         <br>
         <div class="map_legend">
-        <div id="box1" onclick="popup_bg(600,1460)"><i class="box fa fa-play"></i></div> <p>Folklore literature</p>
-        <div id="box2" onclick="popup_bg(1465,1770)"><i class="box fa fa-play" aria-hidden="true"></i></div><p>Islamic Mysticism</p>
-        <div id="box3" onclick="popup_bg(0,600)"><i class="box fa fa-play" aria-hidden="true"></i></div> <p>Contemporary poets</p>
-        <div id="box4" onclick="popup_bg(3960,3960)"><i class="box fa fa-play" aria-hidden="true"></i></div> <p>Contemporary musicians</p>
+        <div id="box1" onclick="popup_bg(600,86000)"><i class="box fa fa-play"></i></div> <p>Folklore literature</p>
+        <div id="box2" onclick="popup_bg(1465,30500)"><i class="box fa fa-play" aria-hidden="true"></i></div><p>Islamic Mysticism</p>
+        <div id="box3" onclick="popup_bg(0,60000)"><i class="box fa fa-play" aria-hidden="true"></i></div> <p>Contemporary poets</p>
+        <div id="box4" onclick="popup_bg(0,1000)"><i class="box fa fa-play" aria-hidden="true"></i></div> <p>Contemporary musicians</p>
       </div>
       </div>
       </div>
@@ -205,6 +205,22 @@ $(document).ready(function() {
 // }
 
 
+// function popup_bg(start,end){
+//   var myIcon = document.querySelector(".audioBG");
+//   var box = document.getElementById("audioBG");
+//   box.currentTime = start;
+//   myIcon.className = "audioBG fa fa-pause";
+//   box.play();
+//   console.log(box.currentTime);
+//   setInterval(function(){
+//     if(box.currentTime>end){
+//       myIcon.className = "audioBG fa fa-play";
+//       box.pause();
+//       console.log(box.currentTime);
+//         }
+//       },1000);
+//     }
+
 function popup_bg(start,end){
   var myIcon = document.querySelector(".audioBG");
   var box = document.getElementById("audioBG");
@@ -212,14 +228,11 @@ function popup_bg(start,end){
   myIcon.className = "audioBG fa fa-pause";
   box.play();
   console.log(box.currentTime);
-  setInterval(function(){
-    if(box.currentTime>end){
-      myIcon.className = "audioBG fa fa-play";
-      box.pause();
-        }
-      },1000);
+  setTimeout(() => { myIcon.className = "audioBG fa fa-play";box.pause(); console.log(box.currentTime);}, end);
     }
 
+
+
 </script>
 <script>
 var aud1= document.getElementById('audioBG');