Antwort an „Franck Dettfurth“ verfassen

SELF-Forum

Count down-Uhr, Audiodatei wird nicht abgespielt

Franck Dettfurth (Versionen)

Hallo: Hat jemand einen Tipp für mich, wo das Problem beim nachstehenden Code bestehen könnte? Die Audiodatei sollte bei Countdown 10 Sekunden abgespielt werden, aber es tut sich nichts - zumindest nicht im Browser. Beim Test auf W3Schools dagegen funktioniert alles wie gewollt.

Danke schon mal für die Hilfe & Gruß, Franck.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Countdown Clock with Audio</title>
<style>
  body {
    font-family: Trebuchet MS, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-image: url('https://schulressourcen.de/schulressourcen/0repositorium/bkgrd_pic1.jpg'); /* Background picture */
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: white; /* Font color */
  }
  #countdown {
    font-size: 200px;
    font-weight: bold; /* Font bold */
  }
</style>
</head>
<body>

<div id="countdown">01:00.0</div>

<audio id="audio" src="https://schulressourcen.de/schulressourcen/0repositorium/thx.wav"></audio>

<script>
// JavaScript for the countdown clock
function startCountdown() {
  // Set the countdown duration to 15 seconds (in milliseconds)
  var countdownDuration = 15 * 1000; // 15 seconds * 1000 milliseconds
  
  // Set the time when the countdown should end
  var endTime = new Date().getTime() + countdownDuration;

  // Update the countdown every 0.1 second
  var x = setInterval(function() {

    // Get the current date and time
    var now = new Date().getTime();
    
    // Calculate the distance between now and the end time
    var distance = endTime - now;
    
    // Calculate minutes, seconds, and tenths of seconds
    var minutes = Math.floor(distance / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    var tenths = Math.floor((distance % 1000) / 100);
    
    // Format minutes, seconds, and tenths to add leading zeros if needed
    var formattedMinutes = (minutes < 10) ? "0" + minutes : minutes;
    var formattedSeconds = (seconds < 10) ? "0" + seconds : seconds;
    var formattedTenths = tenths;
    if (formattedTenths < 10) {
      formattedTenths = "0" + formattedTenths;
    }

    // Display the countdown
    document.getElementById("countdown").innerHTML = formattedMinutes + ":" + formattedSeconds + "." + formattedTenths;
    
    // If the countdown reaches 00:10, play the audio
    if (formattedMinutes == "00" && formattedSeconds == "10") {
      document.getElementById("audio").play();
    }
    
    // If the countdown is over, display a message
    if (distance < 0) {
      clearInterval(x);
      document.getElementById("countdown").innerHTML = "00:00.0";
    }
  }, 100);
}

// Start the countdown when the page loads
window.onload = startCountdown;
</script>

</body>
</html>
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar

Ihre Identität in einem Cookie zu speichern erlaubt es Ihnen, Ihre Beiträge zu editieren. Außerdem müssen Sie dann bei neuen Beiträgen nicht mehr die Felder Name, E-Mail und Homepage ausfüllen.

abbrechen