Audio and Video HTML 5 Media Elements Audio

Audio and Video HTML 5 Media Elements

Audio For HTML standard: • MP 3, • WAV, and • OGG files are standard (Others may work, but no guarantee)

Example: (Audio) <audio controls> <source src=“asong. ogg" type="audio/ogg"> <source src=“asong. mp 3" type="audio/mpeg"> Don’t need both – one is a back-up Your browser does not support the audio element. </audio> Breaking it down: <audio></audio> for audio elements Controls: makes the play/pause bar pop up Source src=: this is the name (and path to the name) of the audio file (I put a back-up audio, but you don’t have to!) Type: the file’s type, which is an audio element, and either an ogg or an mpeg file type Your browser does not… shows up if the browser is old and won’t play audio elements

Audio: Other controls <audio controls autoplay>… Allows the audio file to start playing automatically Last check, didn’t work on chrome <audio controls autoplay muted>… Automatically starts playing, but is muted This does work on chrome!

Adding Video Types: • mp 4, • webm, • ogg (others may work, but no guarantee)

Video tags: Gives you play, pause, volume bar <video width="320" height="240" controls> <source src="movie. mp 4" type="video/mp 4"> <source src="movie. ogg" type="video/ogg"> Don’t need both – one is a back-up in case the first can’t be displayed Your browser does not support the video tag. </video> Must specify path to video file Shows up if the browser won’t display the video

Video: Other controls <video controls autoplay>… Allows the video file to start playing automatically Last check, didn’t work on chrome <video controls autoplay muted>… Automatically starts playing, but is muted This does work on chrome!