MP3 in Website einbinden mit HTML5 Audioplayer und audio-Tag

[Steffie]

Ich wollte gerade MP3-Dateien anstatt mit Flashplayer mit HTML5 einbinden.

Zum Einbinden von MP3-Dateien in HTML5 gibts ja den audio-Tag

Code: Alles auswählen

<audio controls>
  <source src="datei.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio> 

Weiß zufällig jemand wie ich anstatt dem MP3-Player, der mit dem Element controls angezeigt wird, ein Bild anzeigen kann. (Ich möchte ein gif mit einem Lautsprecher anzeigen, bei Klick darauf soll die Datei abgespielt werden)

Grund des Problems: Auf einer Seite habe ich ca. 100 einzelne MP3 Dateien und nun lädt der Audio-Player 100 mal und verzögert den Seitenaufbau.

Ich google schon ein paar Stunden und finde nichts.

Wenns nicht klappt, dann bleibts bei der Einbindung mit Flashplayer.

Gruß
Steffie