Image suvolee

Fermé
gaya_102 - 26 nov. 2008 à 14:37
XanderS2X Messages postés 430 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 1 février 2009 - 28 nov. 2008 à 16:23
Bonjour,
Je voudrais que quand les personnes passe la souris sur l'image la même en grand apparaisse et quand la souris n'est plus sur l'image que la grande image disparaisse. J'ai trouvé comment ouvrir des pop up mais je voudrais pas que les personnes soient obligé de fermer la page. De plus certain navigateur bloque les pop up. Avez vous une solution. Je suis sure que c'est tout bête. lol . Merci d'avance
A voir également:

1 réponse

ladgalen Messages postés 143 Date d'inscription jeudi 3 janvier 2008 Statut Membre Dernière intervention 6 septembre 2013 10
26 nov. 2008 à 14:46
Voici un bout de code javascript qui permet de le faire dans un lien :

<a href="#"
    onMouseOver="JavaScript:document.UN_NOM_DE_TON_CHOIX.src='image2.jpg';"
    onMouseOut ="JavaScript:document.UN_NOM_DE_TON_CHOIX.src='image1.jpg';">
    <img name="NOM_DE_TON_CHOIX" src="image1.jpg">
    plop
</a>


Sinon tu peux le faire facilement avec du CSS mais dans ce cas les noms des images sont dans la feuille de style et ne sont plus dans le html.

Tu fais un truc du genre

.monimage p {
    background-image:url(image1.jpg);
    background-position:0 0;
    background-repeat: no-repeat;

}

.monimage p :hover {
    background-image:url(image2.jpg);
    background-position:0 0;
    background-repeat: no-repeat;
}


et dans le html

<p class="monimage"></p>


0
En fait ca marche pas. Je me demande si ca vient aps du fait que j'ai dimensionné ma colonne et que la grande image ne rentre pas. je crois que je vais etre obliger de faire une pop up. Faudrais que je trouve le moyen pour que la pop se referme après le survol
0
XanderS2X Messages postés 430 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 1 février 2009 26 > gaya_102
26 nov. 2008 à 15:11
En tombant sur ce sujet je n'ai pas pu m'empêcher de penser à un chose qui pourrait sûrement vous plaire !
C'est comme une pop-up, mais en plus beau et ça se ferme, ça peut contenir tout ce que vous voulez, et surtout, ça dynamise un brin votre site : le LightBox.

Le LightBox est une "astuce" à base de JavaScript, d'HTML et de CSS, qui permet sur le clic d'une image, d'afficher un cadre sobre, avec un bouton "Close", comme dans une pop-up, sauf que c'en est pas vraiment une.
Tout le reste de votre page sera légèrement noircie en même temps, et la LightBox peut même apparaître progressivement, ce qui met un certain effet sympa à l'œil.

Plus d'infos ici, avec démonstrations en prime !
0
gaya_102 > XanderS2X Messages postés 430 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 1 février 2009
26 nov. 2008 à 15:14
C'est sympa ca. Comment faut il faire sachant que je m'y connais vraiment pas beaucoup
0
XanderS2X Messages postés 430 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 1 février 2009 26 > gaya_102
26 nov. 2008 à 15:15
Les instructions sont indiquées juste en-dessous ;) !

En revanche elles sont en Anglais, besoin d'aide aussi pour ça ? je peux vous les traduire progressivement.
0
gaya_102 > XanderS2X Messages postés 430 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 1 février 2009
26 nov. 2008 à 15:18
oups desole je n'avais pas vu. Ce soir j'essaierai de le traduire et de le faire. Merci en tout cas
0