Mon code est le suivant. Ce que je veux est apparemment simple: mettre le son en pause lorsque je clique. J'ai essayé avec une instruction If à l'intérieur de l'écouteur sans succès.

const box = document.querySelector('.box');
		
box.addEventListener('click', e => {
  e.target.classList.toggle('pause');
  audio.play();
});
body{
  background: #222;
  height: 100vh;
  width: 100%;
  margin: 0;
  padding: 0;
}

.center{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.box{
  width: 74px;
  height: 74px;
  box-sizing: border-box;
  border-style: solid;
  border-width: 37px 0px 37px 74px;
  border-color: transparent transparent transparent steelblue;
  transition: all 100ms ease-in-out;
}

.pause{
  border-style: double;
  border-width: 0px 0px 0px 60px;
}
<div class="container">
  <div class="box center"></div>
</div>
  
<audio id="audio" src="http://riseofrome.altervista.org/PM_FSSF2_CYBERTECH_ACTIVATION_5_304.mp3" ></audio>

https://jsfiddle.net/hgf6zjyv/1/

Comment puis-je implémenter la fonction pause?

0
albreik 7 nov. 2019 à 23:56

1 réponse

Un exemple peut être trouvé ici

<script>
var x = document.getElementById("myAudio"); 

function playAudio() { 
  x.play(); 
} 

function pauseAudio() { 
  x.pause(); 
} 
</script>

Si vous voulez basculer cependant, regardez ici et posez vos questions plus précisément.

function togglePause() {
     if (myAudio.paused && myAudio.currentTime > 0 && !myAudio.ended) {
         myAudio.play();
     } else {
         myAudio.pause();
     }
}

Edit: écoute du commentateur amical. :)

-1
astein 7 nov. 2019 à 21:20