HTML - Jukebox audio en flash

Auteur : 3L!X | Créé le : 15/05/2008 à 17H00

Nous allons voir comment insérer un jukebox audio sur votre site (format .mp3).
Ce jukebox est en flash, de façon à être compatible avec tous navigateurs, et de ne pas à avoir à charger de plugin supplémentaire.

Le lecteur peut changer de couleurs grâce à des paramètres optionnels (voir ci-dessous).

Mise en place du lecteur

Téléchargez le fichier mp3multi.rar, et décompressez le pour récupérer les fichiers mp3multi.swf et config_mp3multi.txt.

Copiez ces fichiers et vos fichiers audios .mp3 à la racine de votre site ou dans un répertoire de votre choix.

Puis recopiez ce code sur votre page web, en modifiant les parties en noires :

<object type="application/x-shockwave-flash" data="/mon_repertoire/mp3multi.swf" width="240" height="120">
  <param name="movie" value="/mon_repertoire/mp3multi.swf" />
  <param name="flashvars" value="config=/mon_repertoire/config_mp3multi.txt" />
  <param name="wmode" value="transparent" />
  <param name="menu" value="false" />
</object>

Notre fichier config_mp3multi.txt (Voir "Paramètres du Jukebox" ci-dessous):

mp3=test.mp3|test2.mp3
title=Another Make Love|Feel and Move
width=240
height=120
volume=150
showvolume=1
bgcolor1=336699
bgcolor2=0f1f2f
playlistalpha=10

Paramètres du Jukebox

Voici les différents paramètres optionnels pour ce lecteur, à ajouter dans votre fichier "config_mp3multi.txt" :

• "mp3=" Indique les adresses relatives ou absolues des fichiers mp3, séparés par des |.
• "title=" Les titres séparés par des |.
• "playlist=" L'url du fichier texte indiquant les mp3 à charger. Chaque ligne doit avoir l'url du mp3. Il est possible d'ajouter le titre après un | sur la même ligne.
• "width=" Largeur en pixel du jukebox.
• "height=" Hauteur en pixel du jukebox.
• "volume=" Le volume initial, entre 0 et 200 (100 par défaut).
• "showvolume=1" Pour afficher le bouton VOLUME.
• "showlist=0" Pour cacher la liste.
• "showinfo=1" Pour afficher le bouton INFO.
• "showslider=0" Pour cacher la barre de lecture.
• "showloading=" Affichage du chargement : autohide, always ou never.
• "showplaylistnumbers=0" Pour cacher la numérotation de la playlist.
• "autoplay=1" Pour lire automatiquement.
• "loop=1" Pour boucler.
• "shuffle=1" Pour lire aléatoirement.
• "skin=" L'URL du fichier JPEG (non progressif) à charger.
• "loadingcolor=" La couleur de la barre de chargement.
• "bgcolor1=" La première couleur du dégradé du fond.
• "bgcolor2=" La seconde couleur du dégradé du fond.
• "buttoncolor=" La couleur des boutons.
• "buttonovercolor=" La couleur des boutons au survol.
• "slidercolor1=" La première couleur du dégradé de la barre.
• "slidercolor2=" La seconde couleur du dégradé de la barre.
• "sliderovercolor=" La couleur de la barre au survol.
• "textcolor=" La couleur du titre (ffffff par défaut).
• "bgcolor=" La couleur de fond.
• "playlistcolor=" La couleur du fond de la playlist.
• "playlistalpha=" La transparence de la playlist, entre 0 et 100 (50 par défaut).
• "currentmp3color=" La couleur de la piste sélectionnée.
• "scrollbarcolor=" La couleur de la barre de défilement.
• "scrollbarovercolor=" La couleur de la barre de défilement au survol.
• "buttonwidth=" La largeur des boutons (26 par défaut).
• "sliderwidth=" La largeur de la barre (20 par défaut).
• "sliderheight=" La hauteur de la barre (10 par défaut).
• "volumewidth=" La largeur du bouton VOLUME (30 par défaut).
• "volumeheight=" La hauteur du bouton VOLUME (6 par défaut).

Les raccourcis clavier

[0] commentaires - Voir/Editer