Miért nem játsza le a zenét a weboldalamon?
<!DOCTYPE html>
<html lang="en">
<head>
<title>Website</title>
<link rel="stylesheet" href="style.css">
<script src="scripts/main.js"></script>
</head>
<body>
<div class="container">
<img src="img/bird.png" id="musicplay" alt="sound">
<audio id="music" loop>
<source src="audio/bird.mp3" type="audio/mp3">
</audio>
</div>
</body>
</html>
style.CSS
*{
padding: 0;
margin: 0;
}
body {
background: #fe9900;
}
.centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 30px;
}
#musicplay {
position: fixed;
right: 6px;
bottom: 6px;
}
#musicplay:hover {
cursor: pointer;
transform: rotate(360deg);
transition: transform .7s ease-in-out;
}
iframe {
width: 100%;
height: 342px;
}
#musicplay {
width: 40px;
height: auto;
}
main.js
function a() {
var elem = document.getElementById('musicplay');
var audio = document.getElementById('music');
var playing = false;
elem.addEventListener('click', function () {
if (playing) {
audio.pause();
} else {
audio.play();
}
playing = !playing;
});
}
img/bird.png illetve a audio/bird.mp3 fájlokat bemásoltam a helyükre.
<audio id="music" loop>
document.getElementById('musicplay');
E két sort megnézve egyből feltűnik a hiba.
Megtennéd, hogy leírod, hogy hol a hiba, mert sajnos még mindig nem tudom.
Köszi.
1. Bár a Javascript-kódban deklaráltad az a() metódust, de nem hívtad meg, így a metódus törzsében levő kód nem fut le.
2. Ha még meg is hívod deklaráció után az a() metódust - valahogy így:
a();
akkor sem tud rendesen lefutni, mert az oldal elején a <head> és </head> elemek között van (amikor nem töltődött be a teljes oldal, így nyom egy "TypeError: elem is null"-hibát), nem a </body> előtt közvetlenül.
#7: A felhasználó által kezdeményezett lejátszást nem, csak az automatikus indításút - például Firefoxnál
Kapcsolódó kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!