Browse DevX
Sign up for e-mail newsletters from DevX


Inserting Audio

In this section, you'll learn how to insert audio into your site.




Building the Right Environment to Support AI, Machine Learning and Deep Learning

he following sections discuss linking to sound files, embedding sound files, autoplaying sounds, adding background sound, and using JavaScript to insert audio. We'll continuously update and add more ways of adding audio as we learn more. Click on any of the sections to learn more about that particular technique.

  • Link to sound files using the <a href="file" tag>.

  • Autoplay sound files, using the <meta> tag.

  • Embed sound files using the <Embed> tag.

  • Add background sound (only for IE browsers), using the <bgsound>, or:

  • Add sound via scripting, with on click, onload onload="window.location="url of sound file," and onmouseover sounds.

Linking to Sound Files

In this section we'll show you how to link some sound into your site.

Linking to sound files is one of the easiest ways to insert sound into your site. But linking to sound files isn't the most exciting way to insert sound. Instead of mousing over a word and hearing a sound, your users have to click on a link and possibly wait a few seconds before hearing a sound. It's a simple and fast way to put some sound into your site, however, and it's one of the most commonly used ways of inserting audio.

<a href="file">

Use the anchor tag, as shown above, to link to the sound file. If the reader wants to hear the sound they simply click on the link. For example, you might have a segment in an HTML file that looks like this:

Listen to Beethoven's Moonlight Sonata! (Go ahead and click it—it's a live link). This file is a 12 KB MIDI file. This sound clip is 5:07 seconds long, and if you listen to the whole thing, you might find yourself in a more relaxed mood.

Here's what the code for that link looks like:

Listen to Beethoven's <a href="../assets/devx/8989.mid" controls=true>Moonlight Sonata</a>!

The <a href="../assets/devx/8989.mid" refers to the location of the sound clip, and links to that sound clip.

The "controls=true" portion of the code tells the browser to display a sound console, so that readers may stop, pause, or rewind the sound clip. If you clicked on the above link, you saw the sound console. Our Embedding Sound page has more information on creating sound consoles.

To download and then hear the file play, the reader simply clicks on the link. After the browser downloads the sound, it launches a player and automatically starts playing the sound. The reader clicks on the stop button button to stop the music from playing.


Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date