HTML5 audio and video

ZenRays 00:37 1 Comment Edit

In early version of HTML plug-in was needed to embed audio and video elements.In HTML5, there is no need to download third-party software.Audio and video playbacks are supported by HTML5 in the browser without third-party software. Using these elements we can include audio and video content in our webpge. <audio> and <video> tags are used to add media content to the website.
<audio> element is used to play an audio file.Below is the code to play an audio file in HTML document

<!DOCTYPE html>
<html>
<body>

<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
</audio>

</body>
</html>

In the above code,audio uses the attribute control to add controls like pause, play, volume.source is used to specify the audio files and type defines the type of the audio file.
The output of the above code is

We can also include the text between the <audio> and </audio> tags which will be displayed if the browser does not support the audio elements.mp3,wav,ogg are the audio formats supported in html5. mp3 format is supported by all the browser, IE will not support Wav and ogg format. Safari will not support ogg format.

<video> element is used to play a video file. Below is the code to play a video file in html5.

<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
</video>

</body>
</html>

In the above code,video uses the attribute control to add controls like pause, play, volume.source is used to specify the video files and type defines the type of the video file.
The output of the above code is

We can also include the text between the <video> and </video> tags which will be displayed if the browser does not support the video elements. We can also start the video automatically by including autoplay attribute within the video tag.
<video width="300" height="200" autoplay> mp4,WebM,ogg are the formats supported in html5. mp4 format is supported by all the browser. IE and safari will not support WebM and ogg formats.
HTML5 made life of the developers easy by adding <audio> and <video> tags to include media elements. Say goodbye to all third-party softwares like Adobe flash player plug-in and make use of these tags

ZenRays provide the following to make you expert

zenrays providing html5 training in Bangalore

Fully practical and project-based sessions from first class.
Training by Experienced Consultants, not regular Trainers
Friendly and enthusiastic faculty to clear your doubts 24X7
Free Live project after the training to get you industry experience

If you want more details please visit us:

Zenrays.com Reach us at trainings@zenrays.com

ABOUT THE AUTHOR

Hello We are OddThemes, Our name came from the fact that we are UNIQUE. We specialize in designing premium looking fully customizable highly responsive blogger templates. We at OddThemes do carry a philosophy that: Nothing Is Impossible