Sujet Précédent Sujet Suivant

Insérer un diaporama

frclgui Messages postés 61 Statut Membre -  
txiki Messages postés 6819 Date d'inscription   Statut Contributeur Dernière intervention   -
Bonjour,
Quelqu'un pourrais t-il m'expliquer comment je dois faire pour insérer un diaporama dans ma page web ?
quels-sont les balises à utiliser, est-ce que c'est comme pour une image ?
Merci

4 réponses

Réponse 1 / 4
txiki Messages postés 6819 Date d'inscription   Statut Contributeur Dernière intervention   524
 
Oups le script (diapora.js): 

// ========== Script pour le diaporama =========
<!-- DEBUT DU SCRIPT DIAPORAMA-->
var rotate_delay = 3000;
current = 0;
function next() {
if (document.slideform.slide[current+1]) {
document.images.show.src = document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex = ++current;
   }
else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex = --current;
   }
else last();
}
function first() {
current = 0;
document.images.show.src = document.slideform.slide[0].value;
document.slideform.slide.selectedIndex = 0;
}
function last() {
current = document.slideform.slide.length-1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop";
rotate();
}
function change() {
current = document.slideform.slide.selectedIndex;
document.images.show.src = document.slideform.slide[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {
current = (current == document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout("rotate()", rotate_delay);
   }
}
//  End -->
2
Réponse 2 / 4
zevinny Messages postés 168 Statut Membre 56
 
Tout dépend de la façon dont tu veux montrer le diapo!

Avec les images à côté ou par un simple clic et le diapo démarre...

Mais Power point, permet de sauvegarder de façon a ce qu'il soit dirrecte jouable "PPT" ou "PPS" puis il y a aussi le format web...

juste sauvegarder en format désiré et le forwarder sur le ftp.

le code doit être du genre <a href="fichier.pps">mon diapo</a>
0
frclgui Messages postés 61 Statut Membre 1
 
Bonjour,
Effectivement je suis en pleine construction!
Bon, si j'ai bien compris, étant donné que je travaille en xhtml et en css, je ne dois rien faire un css pour le diaporama?
0
Réponse 3 / 4
txiki Messages postés 6819 Date d'inscription   Statut Contributeur Dernière intervention   524
 
Salut a tous,
Je viens d'en faire un ici: http://etxekolana.free.fr rubrique Photos.
On peut soit le lancer en auto en cliquant sur Lancer, ou bien le faire image par image.

C'est du javascript.
Si ça vous interresse, le vous passerai le code, si c'est ce que tu veux faire du moins. Attention, toutes les photos doivent avoir la même taille.

Cordialement !.

Le bonheur est la seule chose que l'on peut donner sans l'avoir.
0
Imagelle
 
Salut,
Je voudrais bien insérer un diaporama dans mon site, et je suis allée voir ton exemple sur ton lien. C'est vraiment bien. Tu dis pouvoir fournir le code. Est-ce possible de l'avoir ? et si c'est un diaporama monté avec power point 2007 avec du texte et des animations et pas seulement des photos, est-ce que ça fonctionne pareil ?

Merci et bonne journée !
0
Réponse 4 / 4
txiki Messages postés 6819 Date d'inscription   Statut Contributeur Dernière intervention   524
 
Salut Imagelle,
Voici le script que tu enregistrera diaporama.js. Ensuite, dans le head de ta page tu mettra ceci:
<script language="JavaScript" src="/ton_dossier/diaporama.js" type="text/javascript"></script>

Ensuite, à l'endroit du diaporama, il faudra insérer ce formulaire (à l'intérieur d'un tableau centré): 
<table align="center" cellpadding="4" cellspacing="1" bgcolor="#000000">
<tr>
<td align="center" bgcolor="f0f0f0"><strong> DIAPORAMA </strong> </td>
</tr>
<tr>
<td align="center" bgcolor="ffffff" width="499" height="374">
<img src="/ton_dossier_photos/ta_photo1.jpg" width="499" height="334" name='show'/></td>
</tr>
<tr>
<td align="center" bgcolor="#f0f0f0">
  <select name="slide" onChange="change();">
  <option value="/ton_dossier_photos/ta_photo2.jpg" selected>ton commentaire 1
  <option value="r/ton_dossier_photos/ta_photo3.jpg"> ton commentaire 2
</select> </td>
</tr>
<tr>
<td align="center" bgcolor="#f0f0f0">
<input type="button" onclick="first();"value="|<<" title="Premi&egrave;re"> 
<input type="button" onclick="previous();" value="<" title="Pr&eacute;c&eacute;dente"> 
<input type="button" name="slidebutton" onClick="ap(this.value);" value="lancer" title="Automatique"> 
<input type="button" onclick="next();" value=">" title="Suivante"> 
<input type="button" onclick="last();" value=">>|" title="Derni&egrave;re"> 
</td>
</tr>
</table>
</form>
<!-- FIN DU SCRIPT DIAPORAMA-->


ATTENTION ! toutes tes photos doivent avoir les mêmes tailles, dimensions (ici elles font 499 pixels par 334)

Ce diaporama peut se lancer automatiquement ou manuellement selon le bouton sur lequel tu clique.

Si tu a des soucis, dis me le.
Bon courage !

Le bonheur est la seule chose que l'on peut donner sans l'avoir.
0