Something as simple as this?
<img src="some_image.jpg" />
<audio controls
src="some_audio.mp3">
Your browser does not support the <code>audio</code> element.
</audio>
This will display whatever image with an audio track underneath. If you’d like some sort of dynamic interaction with the img+audio you will need to use javascript. I can give an example if that’s the case.
I want to display an image with an audio attachment like an mp3 file. What’s the best way to make this work in html5?
This links to the audio file and makes it clickable to play. I was looking for something which can make the audio file clickable to play below the image, not as a link on the image. Thanks for the answer.
The intention was to have an audio file describing the object in the image. This seems to be a reasonable way to achieve it using html.