Bonjour.

J'ai très récemment commencé un pop up ou via une sorte de fenêtre Alert un petit peu comme sur ce site : http://asia.cnet.com/product/panasonic [...] -45218337.htm (j'ai vu d'autre si qui utilisait ce système également)

Je reformule donc, comment faire apparaitre une fenêtre en premier plan contenant une image ? (parfois de très grande résolution) ou plutôt, quelle fonction ou quelle façon de faire je devrais employer.

Par contre évité sil-vous-plais les trucs genre galeriejavascript en trois click ou autre truc tout fait.

Merci d'avance aux personnes qui prendront part au sujet.

Même si ce n'est pas ce que tu veux, un des scripts qui fait ça et que je trouve super est : zoombox : http://www.grafikart.fr/zoombox
car tu peux naviguer entre les différentes images, et tout est déjà fait du genre redimensionnement de la fenêtre etc.

tu peux tenter de regarder le script sinon .

Sinon, en css tu met une div pour le fond noir, et une div pour le conteneur de ton image, en position fixed, et centré.
tu dois avoir quelque part une référence à ton image "haute" résolution, celle qui apparaît quand tu cliques sur l'image miniature, tu peux mettre l'url de la grande image dans l'attribut "alt" de ton <img src...> et aller la chercher ensuite avec javascript en ciblant l'attribut "alt" de l'image que tu viens de cliquer (je ne sais pas si c'est la meilleure façon, mais ça te permet d'avoir un endroit simple pour trouver l'url de la grande image).
tu crées une fonction pour redimensionner l'image en fonction de la résolution de ton écran, du genre
tu crées une variable image = new Image();
tu lui mets la source de l'image que tu veux (avec la grosse résolution)
tu prends la dimension de ton image avec width et height
tu vérifies que l'image ne dépasse pas une certaine valeur, ou qu'elle ne dépasse pas les dimensions de ta page moins une certaine marge.

Ensuite avec la fonction load tu vas afficher l'image : tu lances l'image "gif" de chargement (http://www.ajaxload.info/ pour générer l'image) et tu la fait disparaître une fois que l'image est loadée :

$('#mon_id').load(function(){
image_de_loading.hide();
}).attr('src', la_source_de_ton_Image);

pour les dimensions de ton "conteneur" (créé au départ), tu peux changer ses paramètres "css" avec la fonction "css" dans jquery, en fonction des dimensions de ton image.

Voilà, j'espère que ça pourra t'aider.

le script que tu présente fait exactement ce que je cherchais, mais je n'aime pas trop utilisé des chose toute faite, j'ai un peu l’impression que l'on me donne de la nourriture pré-mâché.

Quant au explication, je comptait stocker les chemin vers les image dans une base de donnée, mais en cas ou je ne l'aurai pas fait Alt aurai pu être pratique en effet.

J'avais pensée a mettre l'image en Fixed, mais pour la centré je ne savais pas trop comment faire, je n'ai pas tester mais je suposais qu'il centrerais par rapport a la position et non par rapport au navigateur.

Merci de prendre de ton temps pour m'aider .

edit: bon sa semble un peu plus "lourd" en CSS que prévu, je vais utilisé se truc la en attendant que j'aie la courage de terminé mon code.