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

Soyez le premier à donner votre avis sur cette source.

Vue 25 358 fois - Téléchargée 1 855 fois

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>

Codes Sources

A voir également

Ajouter un commentaire Commentaires
Messages postés
3
Date d'inscription
samedi 30 octobre 2010
Statut
Membre
Dernière intervention
31 octobre 2010

Voici le script brut
Le reste des fichier pour l'utilisation est dans zip

Bonne utilisation
Ps : ce script est utilisable sur une page en .php
Intitulé des la page dans le zip : musique.php
Le script est a placé entre les balise et

<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("-- Grégoire - Biographie -");
cheminMP3.push("");
description.push("Biographie - [javascript:void(0); ] ';
boutons+= '[javascript:void(0); ]';
commentaire= 'Sélectionnez un titre et attendez quelques secondes...';
document.write("

");
document.write("<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>');
document.write('

');
document.write('

');
document.write('
');
changeListe(document.formulR);
</SCRIPT>
Messages postés
3
Date d'inscription
samedi 30 octobre 2010
Statut
Membre
Dernière intervention
31 octobre 2010

Salut je trouve ce script très sympa, d'ailleurs je l'ai intégret dans un site web que je viens de créer..
http://www.fiesta-mag81.net rubrique loisirs..

Je joint ici le script amélioré qui permet une toute autre approche du script..
Voilà j'espère que sa pourra servir...

Le script complet est téléchargeable ici : http://www.atoutservice81.net/Upload_musique.zip
Messages postés
1
Date d'inscription
vendredi 7 mai 2004
Statut
Membre
Dernière intervention
11 décembre 2005

Bonjour, J'ai modifier un peu ton code,

Ce script fontionne sous tous les naviguateurs :

<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("schnappi");
cheminMP3.push("schnappi.mp3");
description.push("musique comique");

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("desciption ");

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("desciption ");

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("desciption ");

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(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 = "<object type="audio/mpeg" data=""+cheminMP3[numero]+"" height="45" width="300"> ";
}
else if(stop==true)
{
document.getElementById("blocson").innerHTML = " ";//"";
}
}

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(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]!=''));
}
// boutons Play et Stop avec un rollover qui change la couleur.
//
qui affiche les boutons
//
Commentaire + blocson
document.write('
');
boutons = '[javascript:void(0); ] ';
boutons+= '[javascript:void(0); ]';
commentaire= 'Sélectionnez un titre et attendez quelques secondes...';
document.write("

");
document.write("<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>');
document.write('

');
document.write('

');
document.write('
');
changeListe(document.formulR);
</SCRIPT>
Messages postés
4936
Date d'inscription
lundi 17 février 2003
Statut
Modérateur
Dernière intervention
14 février 2014
37
en plus... j'avais pas fait attention... ce n'est pas du PHP mais du JavaScript.
Messages postés
4936
Date d'inscription
lundi 17 février 2003
Statut
Modérateur
Dernière intervention
14 février 2014
37
ca serait sympa aussi de faire attention à l'orthographe... "SCRIPT PHP MUSIQUE CHOIT DU VISITEUR DE LA MUSIQUE DANS UNE LISTE"... hum

Faire de l'informatique ne rime pas forcément avec mauvais en français... même si c'est trop souvent le cas.
Afficher les 6 commentaires

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.