Why do you have to use a separate tag for audio? Is there a reason, why you can’t just add the src attribute directly to the audio tag, like you do with img: .
You don’t have to do it the way they showed it in the lesson, can can use the <audio>
tag in the same way as the <video>
tag.
Like:
<audio
controls
src="/media/examples/t-rex-roar.mp3">Your browser does not support the
<code>audio</code> element.
</audio>
One thing to take into account is that not all browsers support the same file types, so you might want to use multiple sources of different types of audio file, in that case, you will want to do it like they did it in the lesson:
<audio controls>
<source src="myAudio.mp3" type="audio/mpeg">
<source src="myAudio.ogg" type="audio/ogg">
<p>Your browser doesn't support HTML5 audio. Here is
a <a href="myAudio.mp4">link to the audio</a> instead.</p>
</audio>
Take a look at the example shown here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio#Attributes
If audio
tag and video
tag works well with a nested source
tag, so it could work well in all media tags like img
tag and so on?
Lesson: https://www.codecademy.com/courses/learn-html/lessons/semantic-html/exercises/audio-and-attributes
Great day.
what if i used the src attribute in the audio element? like we do with the img tag ? is it possible ? is it necessary to use the source tag ?
Yes, I am pretty sure that is possible since the program didn’t register that as an error, but also try looking that question up. Hope this helped!
Very useful, thanks!
This was awesome! Thank you!
In other words you also saying it’s best practice to do it like the example in the lesson?
When you list multiple sources, does the browser attempt them in order, until it finds one that works?
Can the audio tag be nested inside the img tag? If so, will the audio autoplay when you’re on the image?
Waiting for a reply to this question. Anyone please!!
Am new to Audio Elements, but my guess is, YES, the browser tries them in order until it finds the compatible one. Someone should correct me if am wrong.
I see. I’ll be trying to see if it works. Thanks
@_icode01 @llexy The <img>
tag can have NO children. To achieve the result of that you would use JS or have a still image with audio overlayed.
why we are using “autoplay” attribute here?
the audio element with attribute “controls” is working very fine
Audio autoplay is not working in my case, how to make the audio autoplay work?
I also tried to make it autoplay which i put it after controls but its not working. So I test the code at W3 workspace and it work. Conclusion maybe codeacademy not have that feature… I also don’t know
<audio controls autoplay>
<source
src="https://content.codecademy.com/courses/SemanticHTML/dogBarking.mp3"
type="audio/mp3"
/>
</audio>
is it a must to use any attributes like controls when embedding audio in html document?
Or just an audio tag is enough to display the audio on the webpage?
If source is a self-closing tag like img, isn’t it good practice to close it with /> ?