Building Player

Building Player

Adding Audio

It's quite easy to add audio to a web page in HTML5 with the new

Type the following code in your text editor.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Tables </title>
</head>
<body>
<h2>Audio Demo </h2>
<audio> controls = "controls">
<source src = "Nas.mp3" type = "audio/mpeg">
<source src = "Nas.ogg" type = "audio/ogg">
Your browser does not support HTML5 Audio
Please use this link instead:
<a href = "Nas.mp3">Nas.mp3</a>
</audio>
<p>
Music: "Nas" hate-me-now
</p>
</body>
</html>

How it work


1. Add the audio tag to your page. This tag indicates where an audio file will be placed.

2. Enable controls. You can do this with controls=“controls” attribute. This causes a small control to appear. If you leave this out, there will be no control panel for your user to play the clip.

3. Create a source. Inside the audio tag,you can add one or more source elements. Each source element you add indicates a file you will link to.

4. Set the src attribute to indicate the file. The src attribute of the source tag is used to indicate the file name of the audio file you wish to play.

5. alternative code for older browsers. The code below the source tag will only be interpreted by older browsers that do not understand the audio tag. adding an anchor tag with link to the file to enable older browser to dowenload the file.

Adding Video

You can use this <video> tag to add a video to your web page,you have nothing to worry cause video tag is very similar to the audio tag. Note for this to work,the most important standards are called H.264 and Ogg.you can use a convert to covert your video file.

Replace the code in your body tag with this:
<h2>Video Demo </h2>
<video src = "donkey_man.ogv"
controls = "controls">
Your browser does not support HTML5 Video
Please use this link instead:
<a href = "donkey_man.ogv">Nas.mp3</a>
</audio>
<p>
Best movie of the year(donkey_man.ogv).
</p>