Practical Viewer

1 Program 1

Aim (Write on the ruler page)

Create a webpage named audio.html to set an audio file in web page with controls such that it uses HTML5 elements. The audio file must play as soon as the webpage loads in browser and it will start over again, every time when it is completed.

Program (Start from new page after AIM)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Audio Example</title>
</head>
<body>
<audio controls autoplay loop>
  <source src="audio_file.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>
</body>
</html>

Output (Stick on blank page opposite to code)

Download Output

2 Program 2

Aim (Write on the ruler page)

Create another webpage named audio1.html which provides multiple source file formats for the same audio file that plays a sound automatically with controls. The browser should display the message with appropriate attribute, when audio file is not supported by browser. The code must incorporate the list of sound files formats (like wav, MP3 or ogg etc).

Program (Start from new page after AIM)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Audio Example with Multiple Sources</title>
</head>
<body>
<audio controls>
  <source src="audio_file.mp3" type="audio/mpeg">
  <source src="audio_file.ogg" type="audio/ogg">
  <source src="audio_file.wav" type="audio/wav">
  Your browser does not support the audio element.
</audio>
</body>
</html>

Output (Stick on blank page opposite to code)

Download Output