Version imprimable
Salut à tous! En fait je souhaite juste afficher une photo dans ma page html et dès qu'on clic sa l'affiche en grand soit dans une autre page soit dans la même. Est-ce qu'il y a une fonction approprié ou dois-je faire un lien avec la photo concerné pour chaque page???
J'espère que quelqu'un m'a compris...lol
Merci d'avance pour votre aide.
Bonne continuation à tous.
Tcho :)
En utilisant juste CSS et XHTML il doit être possible de créer une classe "photos" pour CSS. Avec de petites dimensions. Ensuite on peut toujours tenter un img:hover avec des dimensions plus grandes. Mais cela pourrait ne pas marcher sur certains navigateurs... en plus ce serait juste pendant qu'on survole la photo.
Le mieux quand même c'est une fonction Javascript à appeler dans le lien avec l'évenement onClick.
Ou encore mieux et moins pénibles en terme de copier/coller: un script coté serveur genre PHP.
D'accord merci je crois que je vais peut être faire du php alors.
Par contre c'est quoi img:hover???
Dès que tu survoles l'image il y a un aperçu plus grand qui apparait???
Pourrais tu m'apporter + de précisions stp.
Et encore merci.
@+
Oui oui c'est ça:
Code:
2
3
4
5
6
7
8
9
10.photo img{ width: 10px; height: auto; } .photo img:hover{ width: auto; height: auto; }
bonjour,
sous IE : la sous-classe hover ne fonctionne que pour la balise <a>
Okki je crois avoir compris par contre tu pourrais me mettre une synthaxe un peu plus précise stp...
Car j'ai rentré le même code que toi en changeant les sources des images et ça n'a pas marché. Il faut le mettre entre les balises <a> </a>???
Merci d'avance pour votre aide.
@+
Vous ne connaissez pas le CSS apparement ?
Vous trouverez certainement un bon tutorial express sur ce site.
Le code est à placé dans un fichier .css
Le fichier html concerné dois pointer sur ce fichier.
Mais si vous pouvez faire du PHP c'est surement mieux.
Enfin je vous donne quand même du code:
Mettez ceci dans <head> ... </head>
Et créez un fichier design_st.css avec le code de mon précédent message.Code:
2<link rel="stylesheet" type="text/css" href="styles/design_st.css" media="screen" title="Style par défaut" />
Mais vous êtes prévenu que ça ne marchera pas sous tous les navigateurs. :wink:
il suffit de mettre l image entre les balises <a></a> et d'appliquer la pseudo-classe :hover sur celle-ci au lieu de l'appliquer sur <img />, comme ça ça marchera quelque soit le navigateur.