Je suis en train de me développer un petit site perso, et j'ai quelques soucis en JavaScript ... je m'explique.
En fait, mon site héberge des vidéos des concerts que je fais, et j'aimerai, au lieu d'avoir soit 36 pages différentes, soit 36 écrans sur la même page, avoir une seule page avec un seul lecteur et toutes mes vidéos.
Voici le code qui tourne en ce moment ... je vous préviens, ce n'est pas joli a voir :
<html>
<body>
<h1>Site de videos des concerts de l'AMCI</h1>
<h2>Concert du Samedi 7 Fevrier 2009 - Salle Louis Armstrong</h2>
<p>
<a href="/videos/Yellow Submarine.wmv">Yellow Submarine </a><br/>
<object type="application/x-mplayer2" style="width: 640px;height: 480px;" data="/videos/Yellow Submarine.wmv">
<param name="filename" value="Yellow Submarine.wmv"/>
<param name="autostart" value="0" />
</object>
</p>
<p>
<a href="/videos/Seven Nation Army.wmv">Seven Nation Army</a><br/>
<object type="application/x-mplayer2" style="width: 640px;height: 480px;" data="/videos/Seven Nation Army.wmv">
<param name="filename" value="Seven Nation Army.wmv"/>
<param name="autostart" value="0" />
</object>
</p>
<p>
<a href="/videos/Staring At The Sun.wmv">Staring At The Sun </a><br/>
<object type="application/x-mplayer2" style="width: 640px;height: 480px;" data="/videos/Staring At The Sun.wmv">
<param name="filename" value="Staring At The Sun.wmv"/>
<param name="autostart" value="0" />
</object>
</p>
<p>
<a href="/videos/Tribute.wmv">Tribute</a><br/>
<object type="application/x-mplayer2" style="width: 640px;height: 480px;" data="/videos/Tribute.wmv">
<param name="filename" value="Tribute.wmv"/>
<param name="autostart" value="0" />
</object>
</p>
...
</body>
</html>
Moi, j'aimerai avoir sur une seule page autant de boutons qu'il y a de chansons, puis un seul écran avec un code qui pourrait ressembler a ca :
<html>
<head>
<script type="text/javascript">
function Lecture(TheNomALire)
{
document.getElementById('Lecteur').innerHTML='<object type="application/x-mplayer2" style="width: 640px;height: 480px;">';
document.getElementById('Lecteur').innerHTML='</object>';
return true;
}
</script>
</head>
<body>
<h1>Site de videos des concerts de l'AMCI</h1>
<h2>Concert du Samedi 7 Fevrier 2009 - Salle Louis Armstrong</h2>
<p>
<input type="button" value="Yellow Submarine" name="btYS" onClick="javascript:Lecture('Yellow Submarine');"/>
<input type="button" value="Seven Nation Army" name="btSNA" onClick="javascript:Lecture('Seven Nation Army');"/>
<input type="button" value="Staring At The Sun" name="btSATS" onClick="javascript:Lecture('Staring At The Sun');"/>
<input type="button" value="Tribute" name="btT" onClick="javascript:Lecture('Tribute');"/>
<input type="button" value="Mademoiselle" name="btM" onClick="javascript:Lecture('Mademoiselle');"/>
<input type="button" value="London Calling" name="btLC" onClick="javascript:Lecture('London Calling');"/>
<input type="button" value="My Generation" name="btMG" onClick="javascript:Lecture('My Generation');"/>
<input type="button" value="Twist And Shout" name="btTAS" onClick="javascript:Lecture('Twist And Shout');"/>
</p>
<p id="Lecteur">
</p>
</body>
</html>
<html>
<head>
</head>
<body>
<h1>Site de videos des concerts de l'AMCI</h1>
<h2>Concert du Samedi 7 Fevrier 2009 - Salle Louis Armstrong</h2>
<p>
<input type="button" value="Yellow Submarine" name="btYS" onclick="Lecture('Yellow Submarine');"/>
<input type="button" value="Seven Nation Army" name="btSNA" onclick="Lecture('Seven Nation Army');"/>
<input type="button" value="Staring At The Sun" name="btSATS" onclick="Lecture('Staring At The Sun');"/>
<input type="button" value="Tribute" name="btT" onclick="Lecture('Tribute');"/>
<input type="button" value="Mademoiselle" name="btM" onclick="Lecture('Mademoiselle');"/>
<input type="button" value="London Calling" name="btLC" onclick="Lecture('London Calling');"/>
<input type="button" value="My Generation" name="btMG" onclick="Lecture('My Generation');"/>
<input type="button" value="Twist And Shout" name="btTAS" onclick="Lecture('Twist And Shout');"/>
</p>
<p id="Lecteur">
</p>
<script type="text/javascript">
function Lecture(TheNomALire)
{
var content = '<object type="application/x-mplayer2" style="width: 640px;height: 480px;">';
content += '<param name="filename" value="' + TheNomALire + '.wmv"/>';
content += '<param name="autostart" value="0" />';
content += '</object>';
document.getElementById('Lecteur').innerHTML = content;
}
</script>
</body>
</html>
- Pas de "javascript:" dans onclick
- Pas onClick mais onclick
- innerHTML Efface le contenu, donc si tu le fais deux fois d'affilié, le premier est effacé
- On me le javascript de préférence dans les balises body, en fin de code
Salut ! J'ai (encore) des soucis : je n'arrive pas a faire fonctionner le tuto de ThunderSeb : j'arrive a créer les vidéos (ca, y'a pas de soucis je pense), mais après, quand je mets l'objet dans ma page HTML ca marche pas : y'a rien qui s'affiche ... Quelqu'un a-t-il déjà eu la même erreur ?
Au passage, est-ce que ca peut venir de ma configuration de Apache ?
Je te remercies ThunderSeb ! j'avais quelques petites erreurs ... Par contre, la fonction Plein écran ne fonctionne pas ... sais tu comment résoudre le problème ?
C'est bizarre, car sur la vidéo d'exemple, sur le site de l'auteur, cette fonction marche. Si je me souviens bien le bouton n'est pas affiché par défaut, et faut l'afficher avec une variable dans l'url du lecteur.
manipulation de la balise <object> avec javascript
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Ma vraie biographie - Ex-Manager de la Validation sur le Site du Zéro - sdlm.be - Horus.aero
Ma vraie biographie - Ex-Manager de la Validation sur le Site du Zéro - sdlm.be - Horus.aero
Ma vraie biographie - Ex-Manager de la Validation sur le Site du Zéro - sdlm.be - Horus.aero
Ma vraie biographie - Ex-Manager de la Validation sur le Site du Zéro - sdlm.be - Horus.aero
Ma vraie biographie - Ex-Manager de la Validation sur le Site du Zéro - sdlm.be - Horus.aero