Afficher une image avec "classe" (site w
Résolu
laveugle
Messages postés
3
Date d'inscription
Statut
Membre
Dernière intervention
-
laveugle Messages postés 3 Date d'inscription Statut Membre Dernière intervention -
laveugle Messages postés 3 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je voulais demander si quelqu'un sait s'il est possible avec du php/html/css et eventuellement javascript d'afficher une image (à partir d'une miniature par exemple) avec un effet comme on voit sur certains site : l'image s'affiche devant la page et la page autour de l'image s'assombrit tout en restant visible. L'image ne s'affiche donc pas dans une fenetre ou alors celle-ci n'a pas de "bord" et une partie est transparente puisque l'on voit toujours la page derriere la partie assombrie autour de l'image...
Je sais pas si c'est très clair mon histoire mais si quelqu'un y comprend quelque chose... ;)
Merci d'avance
Je voulais demander si quelqu'un sait s'il est possible avec du php/html/css et eventuellement javascript d'afficher une image (à partir d'une miniature par exemple) avec un effet comme on voit sur certains site : l'image s'affiche devant la page et la page autour de l'image s'assombrit tout en restant visible. L'image ne s'affiche donc pas dans une fenetre ou alors celle-ci n'a pas de "bord" et une partie est transparente puisque l'on voit toujours la page derriere la partie assombrie autour de l'image...
Je sais pas si c'est très clair mon histoire mais si quelqu'un y comprend quelque chose... ;)
Merci d'avance
A voir également:
- Afficher une image avec "classe" (site w
- Site comme coco - Accueil - Réseaux sociaux
- Site de telechargement - Accueil - Outils
- Quel site remplace coco - Accueil - Réseaux sociaux
- Site pour vendre des objets d'occasion - Guide
- Site pour partager des photos - Guide
4 réponses
Merci beaucoup,
En continuant à chercher j'ai vu qu'il existait un "outil" open source qui permettait de donner cet effet et d'après les explications que j'ai lu dessus ça a l'air de suivre la même idée que toi... (en un peu plus complexe)
https://www.digitalia.be/software/slimbox/ (voila pour l'outil en question et ce qui m'a mis sur la voie c'est cet attribut dans une balise de lien : rel="lightbox[atomium]").
et selon ce même site :
"And of course, it has been tested in all modern browsers: Firefox, Internet Explorer 6+, Opera 8+, Safari 1.3+ and Camino. It is not compatible with the old Internet Explorer 5.5 and will never be."
Voili voilou merci à tous ceux qui m'ont répondu et au forum lui-même sans lequel il n'y aurait pas eu de réponse du tout ;)
En continuant à chercher j'ai vu qu'il existait un "outil" open source qui permettait de donner cet effet et d'après les explications que j'ai lu dessus ça a l'air de suivre la même idée que toi... (en un peu plus complexe)
https://www.digitalia.be/software/slimbox/ (voila pour l'outil en question et ce qui m'a mis sur la voie c'est cet attribut dans une balise de lien : rel="lightbox[atomium]").
et selon ce même site :
"And of course, it has been tested in all modern browsers: Firefox, Internet Explorer 6+, Opera 8+, Safari 1.3+ and Camino. It is not compatible with the old Internet Explorer 5.5 and will never be."
Voili voilou merci à tous ceux qui m'ont répondu et au forum lui-même sans lequel il n'y aurait pas eu de réponse du tout ;)
Tu met un <div> avec un z-index: 1000; qui prends tout la page, avec fond noir, tu cherches la propriété CSS opacity que tu mets à 50% par exemple. Tu centres ensuite ton <img> dans la page, tu ajoutes un bouton "fermer" quelque part et voilà. opacity n'est pas standard donc cela marchera qu'avec les navigateurs très récents comme Firefox, IE7 (peut être sinon IE8 beta), Safari (le plus récent), Opera (idem). En gros tu auras des problèmes avec IE6 et avant. Autre solution, c'est de faire un visualiseur en flash avec fond semi-transparent que tu ajoutes à la taille de la page avec un bouton "fermer" en html/javascript qui redimensionne le visualiseur
