Gallerie d'image

Fermé

Utilisateur anonyme - Modifié par smith3 le 5/04/2012 à 11:05
empty Messages postés 837 Date d'inscription vendredi 25 juillet 2008 Statut Membre Dernière intervention 23 février 2016 - 5 avril 2012 à 11:13

Bonjour,
voila j'ai commencé à créer une galerie d'image et j'ai 2problèmes qui sont :

Le 1er, j'ai créer les miniatures et j'ai créer les grandes vignettes. Le problèmes les grandes vignettes s'alignent les uns en dessous des autres mais pas la1er grande vignette , elle reste aligner par rapport au petites vignettes.

Le 2 ème problème

Je voudrais quand je clique sur les petites vignettes que les grandes vignettes changes.

Voici le code html :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" href="style.css" />

</head>
<body
<div id="content">
<h1> Gallerie d'image en JQUERY</h1>

<div id="galerie_nav"> 

<a rel="fleur"href="#"><img src="fleur.JPG" alt="mini.jpg"/></a>
<a rel="moulin"href="#"><img src="moulin.JPG" alt="moulin.jpg"/></a>
<a rel="jeu"href="#"><img src="jeu.JPG" alt="jeu.jpg"/></a>
<a rel="clown"href="#"><img src="clown.JPG" alt="clown.jpg"/></a>

</div>
</div>

<div id="galerie_big"> <!-- grandes vignettes

<img src="fleur.JPG" alt="fleur.jpg"/></a>
<img src="moulin.JPG" alt="moulin.jpg"/></a><img src="jeu.JPG" alt="jeu.jpg"/></a>
<img src="clown.JPG" alt="clown.jpg"/></a>
</div>

</body>
</html>

Voici mon CSS :

/**/

#galerie_nav img{
margin:2px;
width:100px;
height:100px;
float:left;
text-align:center;
}

#galerie_big img{

width:650px;

}

A voir également:

Gallerie d'image
Image iso - Guide
Acronis true image - Télécharger - Sauvegarde
Faststone image viewer - Télécharger - Visionnage & Diaporama
Image iso windows 10 - Guide
Comment agrandir une image - Guide

1 réponse

Réponse 1 / 1

empty Messages postés 837 Date d'inscription vendredi 25 juillet 2008 Statut Membre Dernière intervention 23 février 2016 176
5 avril 2012 à 11:13

Si tu pouvais donner un lien parce que c'est assez difficile à comprendre, si tu veux pas que ça se mette un en dessous de l'autre mais un à côté de l'autre il faut utiliser la propriété "float: left;" sur l'élément qui se trouvera à gauche de tous les autres qui se trouveront à droite (pas super compréhensible mais je ne vois pas comment expliquer autrement), ensuite pour afficher en grand ce qu'il y a dans la petite vignette en cliquant dessus c'est du javascript...

Discussions similaires