fixed play/pause

index.html

@@ -187,25 +187,39 @@ $(document).ready(function() {
 <!-- scripts for mouse events -->
 
 <script>
-function popup_bg(start,end) {
+// function popup_bg(start,end) {
+  
+//   var myIcon = document.querySelector(".audioBG");
+//   var box = document.getElementById("audioBG");
+//     if (box.paused) {
+//       box.currentTime = start;
+//       myIcon.className = "audioBG fa fa-pause";
+//       setTimeout(function(){
+//       box.play();
+//       console.log(box.currentTime);
+//     }, end);
+// }
+//     // box.currentTime = start;
+//     // console.log(start);
+  
+// }
+
+
+function popup_bg(start,end){
   var myIcon = document.querySelector(".audioBG");
   var box = document.getElementById("audioBG");
-    if (box.paused) {
-      box.currentTime = start;
-      myIcon.className = "audioBG fa fa-pause";
-      box.play();
-      console.log(box.currentTime);
-// the below setInterval is to check the currentTime is greater than 56 or not in every 1 second
+  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();
         }
       },1000);
-};
-    // box.currentTime = start;
-    // console.log(start);
-};
+    }
+
 </script>
 <script>
 var aud1= document.getElementById('audioBG');

static/css/style.css

@@ -263,6 +263,7 @@ background: transparent;
 left: 2px;
 top: 10%;
 opacity: 0.4;
+-webkit-overflow-scrolling: touch;
 }
 
 .thesis:hover {