Script javascript musique choix du visiteur de la musique dans une liste

Télécharger le projet
Commenter

Description

il permet de mettre de la musique sans utiliser des plugins sur explorer ou autre
il est en Javascript et le visiteur a le choit de sa musique dnas une liste
et a ajouter dnas une page web
/!\attention/!\:les musique doivent être au format .mp3

Source / Exemple : 


<SCRIPT language=javascript>

titreMP3 = new Array; cheminMP3 = new Array; description = new Array;

// si un titreMP3[x] commence par "--", ou que cheminMP3[x] = ""
// alors ça fait une entrée dans liste mais ça ne propose pas de musique.

// Je mets volontairement des .push même pour cheminMP3 et description quand y'a pas forcément
// de mp3. ça sert à juste à ne pas avoir de décalage. AVANTAGE : on peut facilement remettre
// dans l'ordre voulu la liste... parce que sinon ça serait titreMP3[0]='blabla', titreMP3[1]='truc'
// et ça serait moins facile à réorganiser.

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("--Une nouvelle selection--");
cheminMP3.push("");//pour un separement entre les musique veulliez ne pas mettre de lien
description.push("description ");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("--Une nouvelle selection--");
cheminMP3.push("");//pour un separement entre les musique veulliez ne pas mettre de lien
description.push("description ");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

titreMP3.push("--Une nouvelle selection--");
cheminMP3.push("");//pour un separement entre les musique veulliez ne pas mettre de lien
description.push("description ");

titreMP3.push("Le titre");
cheminMP3.push("L'url de la musique");
description.push("une brève description");

function ChangeMp3(formulaire, stop)
{
	numero = formulaire.ListeMP3.options[formulaire.ListeMP3.selectedIndex].value;
	if(document.getElementById && document.all && estUnMP3(numero) && stop!=true)
	{
		// chez moi je suis obligé de cliquer sur Stop avant de faire un autre Play
		// donc un "workaround" ;-)
		document.getElementById("blocson").innerHTML = " ";
		document.getElementById("blocson").innerHTML = "<embed src=\""+cheminMP3[numero]+"\" autostart=true loop=true width=100 height=20>";
	}
	else if(document.getElementById && document.all && stop==true)
	{
		document.getElementById("blocson").innerHTML = " ";//"<img src='bouton_stop.gif' width=1 height=1 border=0 />";
	}
}

function changeListe(formulaire)
{
	// quand on change d'élément dans la liste, on affiche les boutons si c'est un MP3
	// et on affiche un petit commentaire s'il y en a un ;-)
	numero = formulaire.ListeMP3.options[formulaire.ListeMP3.selectedIndex].value;
	if(document.getElementById && document.all && estUnMP3(numero))
	{
		document.getElementById("commentaire").innerHTML = description[numero];
		document.getElementById("boutons").innerHTML = boutons;
	}
	else
	{
		document.getElementById("boutons").innerHTML = " ";
		document.getElementById("commentaire").innerHTML = ((description[numero]==''||numero==-1) ? commentaire : description[numero]);
	}
}
function estUnMP3(i)
{ // Si le titre commence par '--' (exemple --Musique classique--)
  // ou si pas de nom de fichier, alors on considère que c pas un mp3
  // mais juste un "séparateur" dans la liste
	if (i==-1) return false;
	return ((titreMP3[i].substring(0,1)!='-') && (cheminMP3[i]!=''));
}

if(document.getElementById && document.all)
{
// boutons Play et Stop avec un rollover qui change la couleur.
	boutons = '<a href="javascript:void(0);"><img src="images/bouton_play.gif" name="play" onMouseOver="document[\'play\'].src=\'images/bouton_play_over.gif\';" onMouseOut="document[\'play\'].src=\'images/bouton_play.gif\';" ';
	boutons+= 'onClick="ChangeMp3(document.formulR, false)" title="Play" border=0></a> ';
	boutons+= '<a href="javascript:void(0);"><img src="images/bouton_stop.gif" name="stop" onMouseOver="document[\'stop\'].src=\'images/bouton_stop_over.gif\';" onMouseOut="document[\'stop\'].src=\'images/bouton_stop.gif\';" ';
	boutons+= 'onClick="ChangeMp3(document.formulR, true)" title="Stop" border=0></a>';
	commentaire= 'Sélectionnez un titre et attendez quelques secondes...';

// <div> qui affiche les boutons
	document.write("<div align=\"center\" id=\"boutons\"></div>");
	document.write("<p align=\"center\"><form name=\"formulR\"><select name=\"ListeMP3\" onChange=\"changeListe(document.formulR)\">")
	document.write("<option value='-1'>--Choisir--</option>");
	for(i=0;i<cheminMP3.length;i++)
	{
		document.write("<option value='"+i+"'>"+titreMP3[i]+"</option>");
	}
	document.write('</select></form>')
// <div> Commentaire + blocson
	document.write('<div align="center" id="commentaire" align="center" style="font-family:Comic Sans MS; font-size:10px; font-weight:bold; color:#CCFFFF;"></div>');
	document.write('<div align="center" id="blocson" style="visibility:hidden"></div>');

	changeListe(document.formulR);
}
else
{
	document.write("Ce script ne fonctionne pas sur votre navigateur, désolé");
}
</SCRIPT>
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.