RAD ZONE au secours!!!!

Fermé
tong - 12 oct. 2007 à 11:39
 tong - 15 oct. 2007 à 20:47
Bonjour rad zone j'ai un autre problème,peut-étre que tu saura à le résoudre:
J'ai créer un autre site internet qui ne comporte que 2 pages web: une page d'accueil simple (qui ne contient que du texte, qui n'a pas de photos) que j'ai nommée page 1, et une autre page,nommée page 2 qui présente un diaporama de 2 photos (c'est-à-dire qu'il y a 2 petite photos, nomméés photo 1 et photo 2 et un grand cadre dans laquelle est chargée la photo 1, de manière à ce que quand je clique sur l'une de ces 2 petite photos, la photo cliquée apparait dans le grand cadre).Bien sur, sur la page 1, il y a un lien hypertexte pour aller à la page 2. Ainsi, lorsque je clique sur le lien hypertext pour aller à la page 2 depuis la page 1, je tombe sur la page 2 avec la photo 1 chargée dans le grand cadre (jusqu'ici, il n'ya pas de problème).Ensuite,lorsque je clique sur la photo 2, la photo 2 apparait sur le grand cadre à la place de la photo 1(là,il n'y a pas de problème).
Ensuite, lorsque je clique sur "Précédente" de la barre d'outil pour aller à la page précédente, je reviens classiquement à la page 2 avec la photo 1 chargée dans le grand cadre.Bien sur, lorsque je clique encore sur "Précédente" de la barre d'outil,je reviens à la page 1.
Mon problème se trouve au premier clic sur "Précédente" de la barre d'outil: ce que je voudrais, c'est que quand je fais mon premier clic sur "Précédente", je tombe directement sur la page 1 au lieu de revenir classiquement à la page 2 avec la photo 1 chargée dans le grand cadre.
Je sais que je peut créer un lien hypertexte sur la page 2 pour aller directement à la page 1 mais je ne le fait pas car je n'ai pas envie de le faire (pour des raisons de style d'organisation de mon site internet),et que je sais que ce que j'ai envie de faire est faisable (en regardant d'autres sites internet comme www.voiturama.fr).Aide-moi s'il te plait à réussir ce coup de génie en insérant la solution dans le code html de mes pages web(j'ai mis mes codes html de mon site internet ci-dessous).Merci d'avance.

(Pour la page 1:)

<html>
<title>page1.html</title>
<body>
Page 1
<a href="Page2.html">Aller à la page 2</a>
</body>
</html>


(Pour la page 2:)

<html>
<title>page2.html</title>
<framset>
Page 2
<iframe src="photo1.jpg" width="500" height="500" scrolling="no" name="cadre" ></iframe>
<a href="photo1.jpg" target="cadre"><img src="photo1.jpg" width="100" height="100"></a>
<a href="photo2.jpg" target="cadre"><img src="photo2.jpg" width="100" height="100"></a>
</frameset>
</body>
</html>

------ ce message a été envoyé à un membre du forum ,et voila ce qui me dit:
L'exemple que tu donnes s'y prend autrement.
Ce n'est pas fait en HTML. C'est impossible.
Ils utilisent du Javascript qui gère ça sur le même page.
Quand tu amènes le pointeur de la souris sur une vignette, qu'est-ce qui s'inscrit dans la barre d'état de ton navigateur ?

Safari me montre ça, par exemple.
Et on retrouve :

<a href="javascript:showImage('9/d/1/thc_9d1b3afa8577bba5d2adeb7c67f859c8.jpg')" title="Agrandir photo">Et donc, on ne quite pas la page et Précédente revient à la précédente.

On trouve des exemples de ce genre de diaporama, de visionneuse sur le web.

RAD ZONE en propose certains sur son site.
À toi de trouver le lien vers son site dans la liste…

------------------
Donc rad zone aide moi s'il te plait à réussir ce coup de génie.Merci d'avance cordialement.

2 réponses

RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
12 oct. 2007 à 14:24
SALUT

oui cela ce fais en js ! mais il faut changer completement ta page pour faire une page

ou il ni as pas de iframe et ou les photo sont appelees par javascript!

mais franchement , moi dans ton cas ( je sais que tu voudrais eviter mais ) je ferais un hyperlien ou un bouton precedent !!!

cela ne changeras pas grand chose a ta page , mais personellement je trouve cela beaucoup plus pratique et ergonomique pour le visiteur d avoir une navigation sur la page

que de le faire par la barre de navigation !!!

RAD

0
tong Messages postés 20 Date d'inscription jeudi 4 octobre 2007 Statut Membre Dernière intervention 31 octobre 2007
12 oct. 2007 à 15:01
Merci pour réponse rad zone.Si c'est en javascript que je dois faire, comment je peut transformer mes pages web en javascript de manière à ce que les photos sont appelées par javascript,car je n'y connait rien en javascript?Peut tu insérer du javascript dans mes 2 pages web?
Merci.Cordialement.
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
13 oct. 2007 à 16:31
voila un exemple !

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=windows-1250">
    <meta name="generator" content="PSPad editor, www.pspad.com">
    <title>
    </title>
<style type="text/css">
 div#galerie {
	width: 410px;
	background: #eed;
	border: 1px solid #dcb;
	padding: 15px;
	margin: 15px 30px;
	text-align: center;
	font: 0.9em Georgia, serif;
}
ul#galerie_mini {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
ul#galerie_mini li {
	float: left;
}
ul#galerie_mini li a img {
	margin: 2px 1px;
	border: 1px solid #dcb;
}
dl#photo {
	clear: both;
	margin: 0 auto;
}
dl#photo dt {
	font: italic 2.5em/1.5em Georgia, serif;
	color: #dcb;
}
dl#photo dd {
	margin: 0;
}
dl#photo img {
	border: 1px solid #dcb;
}
    </style>
<script type="text/javascript">function displayPics() {
var photos = document.getElementById('galerie_mini');
// On récupère l'élément ayant pour id galerie_minivar liens = photos.getElementsByTagName('a');
// On récupère dans une variable tous les liens contenu dans galerie_minivar big_photo = document.getElementById('big_pict');
// Ici c'est l'élément ayant pour id big_pict qui est récupéré, c'est notre photo en taille normalevar titre_photo = document.getElementById('photo').getElementsByTagName('dt')[0];
// Et enfin le titre de la photo de taille normale// Une boucle parcourant l'ensemble des liens contenu dans galerie_minifor (var i = 0;
i < liens.length;
++i) {
// Au clique sur ces liensliens[i].onclick = function() {
big_photo.src = this.href;
// On change l'attribut src de l'image en le remplaçant par la valeur du lienbig_photo.alt = this.title;
// On change son titretitre_photo.firstChild.nodeValue = this.title;
// On change le texte de titre de la photoreturn false;
// Et pour finir on inhibe l'action réelle du lien
}
;
}
}
window.onload = displayPics;
// Il ne reste plus qu'à appeler notre fonction au chargement de la page</script>
  </head>
  <body>
    <div id="galerie">
      <ul id="galerie_mini">
        <li>
        <a href="images/photo1.png" title="Titre de la photo 1">
          <img src="images/minis/m_photo1.png" alt="Le titre de la photo 1" /></a></li>
        <li>
        <a href="images/photo2.png" title="Titre de la photo 2">
          <img src="images/minis/m_photo2.png" alt="Le titre de la photo 2" /></a></li>
        <li>
        <a href="images/photo3.png" title="Titre de la photo 3">
          <img src="images/minis/m_photo3.png" alt="Le titre de la photo 3" /></a></li>
        <li>
        <a href="images/photo4.png" title="Titre de la photo 4">
          <img src="images/minis/m_photo4.png" alt="Le titre de la photo 4" /></a></li>
        <li>
        <a href="images/photo5.png" title="Titre de la photo 5">
          <img src="images/minis/m_photo5.png" alt="Le titre de la photo 5" /></a></li>
        <li>
        <a href="images/photo6.png" title="Titre de la photo 6">
          <img src="images/minis/m_photo6.png" alt="Le titre de la photo 6" /></a></li>
        <li>
        <a href="images/photo7.png" title="Titre de la photo 7">
          <img src="images/minis/m_photo7.png" alt="Le titre de la photo 7" /></a></li>
        <li>
        <a href="images/photo8.png" title="Titre de la photo 8">
          <img src="images/minis/m_photo8.png" alt="Le titre de la photo 8" /></a></li>
        <li>
        <a href="images/photo9.png" title="Titre de la photo 9">
          <img src="images/minis/m_photo9.png" alt="Le titre de la photo 9" /></a></li>
      </ul>
      <dl id="photo">
        <dt>
          Titre de la photo 1        
        </dt>
        <dd>
          <img id="big_pict" src="images/photo1.png" alt="Photo 1 en taille normale" />
        </dd>
      </dl>
    </div>
  </body>
  </html>


RAD
0
Merci rad zone pour ta réponse,je vois que tu est un expert en webmastering.Donc si j'ai un souci de webmastering,je n'hésiterais pas à te consulter.Merci encore.
Tong.
0