DEV Community

Danish Zubair
Danish Zubair

Posted on

Audio in HTML and JavaScript

Hi, I am facing some issues, while creating a really simple web application. I want that wherever the user will click on the page, the music should run in the background. I have downloaded the music in my computer, and then, uploaded to google drive, to get the link. When I got the link and allowed anybody with the link to open and listen to the file, I have pasted the link to the code. I then, runned again, but it is still not working. Can anybody help me in how to add a sound in HTML and JavaScript. This is my code, with the link to the audio file in google drive. Thank you.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body onclick="playAudio()" style="height: 1000px;"> 
<p>CLICK</p>

    <audio id="audio" src="https://drive.google.com/file/d/1oC8w72cZyShs7XW7uDMqIA74bCZRLtvk/view?usp=share_link"></audio>

<script>

function playAudio() {
 var audio = document.getElementById("audio");
 audio.play();

}
</script>    
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (0)