La communauté ALL HTML c'est 58826 membres à ce jour dont 2 inscrits aujourd'hui et 31 depuis une semaine.

  • imprimer
  • aide

Forum de discussions « XHTML - HTML - CSS »

Retrouvez les publications relatives à ces discussions dans nos rubriques CSS, HTML, XHTML.

agrandir des miniatures sans avoir besoin de recréer une page pour chaque agrandissement

liste des forums liste des discussions Participer à la discussion

Photo de Vachefolle91 Message publié le samedi 11 octobre 2008 à 19 h 41 par Vachefolle91.
Bonjour,
Essayons d'être simple pour être comprise...
- J'ai une page web...(appellons là "crea")
- Sur cette page, plusieurs petites images miniatures (nommons les : "min1, min2, min3, min4, min5")
- Je souhaite que lorsque l'on clique sur une miniature son agrandissement apparaisse sur la page

[B]=> Question 1 : est-il possible (avec des pages réalisées en HTML/CSS), de n'avoir qu'une seule page ("crea") tout en sachant qu'il y a plusieurs agrandissements ?[/B]
Ainsi je n'aurai pas à créer une page par agrandissement ("crea1, crea2, etc")...en effet, j'ai une dizaine de pages où j'ai 5-6 miniatures, si je refais une page par agrandissement, je me retrouve avec un site de 20 000 pages !!!

[B]=> Question 2 : Que ce soit possible ou pas, quel code est à utiliser pour qu'un agrandissement apparaisse à côté lorsque l'on clique sur une miniature ?[/B]

Merci pour vos conseils...
Photo de junglist Message publié le dimanche 12 octobre 2008 à 01 h 09 par junglist. www.p1nk-00.com
Salut,

Question 1 : oui

Question 2 : par exemple

<a href="#" onclick="window.open('miniature.jpg', 'photo', 'height=200, width=300, top=100, left=100, toolbar=no, menubar=yes, location=no, resizable=yes, scrollbars=no, status=no');"><img src="miniature.jpg"></a>

. height : la hauteur de la fenêtre (exprimée en pixels) ;
. width : la largeur de la fenêtre (exprimée en pixels) ;
. top : la position verticale de la fenêtre par rapport au bord supérieur de l'écran (exprimée en pixels) ;
. left : la position horizontale de la fenêtre par rapport au bord gauche de l'écran (exprimée en pixels) ;
. toolbar : la présence de la barre d'outils (à l'aide d'un booléen : yes ou no) ;
. location : la présence de la barre d'adresse (à l'aide d'un booléen : yes ou no) ;
. menubar : la présence de la barre de menu (à l'aide d'un booléen : yes ou no) ;
. resizable : la possibilité de redimensionner la fenêtre (à l'aide d'un booléen : yes ou no) ;
. scrollbars : la présence des scrollbars ou ascenseurs (à l'aide d'un booléen : yes ou no) ;
. status : la présence de la barre de statut (à l'aide d'un booléen : yes ou no).


Tu peux aussi choisir d'installer Lightbox 2 pour donner plus de style à tes pop-ups : http://www.huddletogether.com/projects/lightbox2/

Si tu ne souhaites pas ouvrir de pop-up, il te suffit de rentrer un code toujours en javascript, toujours en utilisant la fonction onclick, et en demandant cette fois-ci à ton navigateur d'afficher l'agrandissement de la miniature dans une zone prévue à cet effet. Tu peux t'inspirer par exemple du script proposé sur ce lien : http://css.alsacreations.com/Tutoriels-JavaScript/galerie-photo-javascript

Bon code :)
Photo de Vachefolle91 Message publié le dimanche 12 octobre 2008 à 22 h 12 par Vachefolle91.
Merci junglist !
la toute dernière solution a l'air de plus me correspondre...car je ne veux pas de pop'up ! et même avec Lightbox and co y'a toujours des espèces de pop'up !
je vais aller voir le tutoriel voir si je comprend quelque chose !
Pas facile le code !
Je voulais joindre une image, pour que l'on comprenne bien ce que je souhaite...mais apparemment on ne peut pas...

liste des forums liste des discussions Participer à la discussion

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.

ACCÉS COMMUNAUTÉ

Rejoignez ALL HTML

Publiez vos articles, actualités, communiqués ... Donnez votre avis, partagez votre réseau, rencontrez d'autres membres et participez à la vie de la communauté.

Les 5 dernières discussions