htmlcsscoding htmlcsscoding - 4 months ago 7
HTML Question

I'm trying to get 1 button to control both play and pause, can someone help me?

I'm trying to get 1 button to control both play and pause, can someone help me? And I really want to do it using the code-set below. Hope someone will be able to help with this. https://jsfiddle.net/8e68js93/1/

I know of this code, but I don't know how to incorporate it in the below codes. [

this.paused?this.play():this.pause();
] And if it can't be used with the below codes, I don't want to use it.

<audio id="player" src="http://hi5.1980s.fm/;"></audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
<button onclick="document.getElementById('player').pause()">Pause</button>
<button onclick="document.getElementById('player').pause() ;document.getElementById('player').currentTime=0;">Stop</button>
<button onclick="document.getElementById('player').muted=!document.getElementById('player').muted">Mute/ Unmute</button>
</div>

Answer
    <audio id="player" src="http://hi5.1980s.fm/;"></audio>
    <div>
        <button onclick="togglePlay()">Play</button>
        <button onclick="togglePlay()">Pause</button>
        <button onclick="document.getElementById('player').pause();document.getElementById('player').currentTime = 0;">Stop</button>
        <button onclick="document.getElementById('player').muted = !document.getElementById('player').muted">Mute/ Unmute</button>
    </div>

    <script>
        function togglePlay() {
            var player = document.getElementById('player');
            if (player.paused) {
                player.play();
            } else {
                player.pause();
            }
        }
    </script>

Or all inline:

<button onclick="var player = document.getElementById('player'); player.paused ? player.play() : player.pause()">Play</button>