geluid op een site

[Plotinus]

Ik heb het volgende opgenomen op mijn site:

     <img src="../../../Media/geluid kievit.png"  class= "kievit" onclick="playSound('../../../Media/Kievit.ogg');"/><br>

met script:

function playSound(soundfile) {
 document.getElementById("dummy").innerHTML=
 "<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
 }

Dat leek altijd goed te werken totdat ik het eens uittestte in plaats van onder Chrome, onder Firefo; toen kreeg ik een foutmelding over een plug-in. Ik begrijp nu dat de verschillende browsers verschillende formaten ondersteunen en dat ik daar rekening mee moet houden. Ik ben toen gestuit op het volgende, wat goed werkt in verschillende browsers:

  <audio controls autoplay>
    <source src="../../../Media/Kievit.ogg" />
   <source src="../../../Media/Kievit.mp3" />
  <p>This browser does not support our audio format.</p>
  </audio>

Mijn probleem hierbij is dat ik het niet gecombineerd krijg: ik wil als ik op het plaatje kievit.png klik - zonder dat een spelerbalkje verschijnt - het geluid laten horen. Dat spelerbalkje verwijderen is gemakkelijk (controls) en autoplay spreekt ook voor zich.

Iemand een idee hoe ik het in elkaar schuif, of een andere oplossing die volledig recht doet aan de eerste coderegel? Een verzorgde foutmelding als gevolg van 'onclick' mag ook, zonder een blok te vertonen over een ontbrekende plug-in (storend en sitelay-out verstorend).

 

[plukkies]

Hou het bij je eerste script maar dan MP3 chrome ondersteund ook MP3 maar firefox geen OGG