Créer un Effet de Zoom au Survol des Images

Statut : non résolu

Ce sujet contient 5 réponses, 3 participants et a été mis à jour pour la dernière fois par Frank Lulla, le il y a 9 années.

6 sujets de 1 à 6 (sur un total de 6)

Auteur

Messages
8 juillet 2016 à 18 h 02 min #564900

Frank Lulla
Participant

Initié WordPress
26 contributions

Bonjour,
J’aimerais savoir comment réaliser un effet de zoom au survol d’une image de mon site.

Voici un exemple typique de ce que je souhaite faire:

http://leblogduwebmaster.fr/css3-creer-un-effet-de-zoom-au-survol-des-images-449/

Cordialement !

8 juillet 2016 à 21 h 39 min #1062695

WebCaine
Membre

Chevalier WordPress
139 contributions

Tu a deux possibilités soit par CSS, en faisant avec animate, ou en Javascript avec fade in fade out

9 juillet 2016 à 1 h 00 min #1062696

Frank Lulla
Participant

Initié WordPress
26 contributions

Merci beaucoup ! Je vais essayer ça pour voir

9 juillet 2016 à 3 h 54 min #1062697

WebCaine
Membre

Chevalier WordPress
139 contributions

Whaou, j’ai mal lu en faite ^^ Ce que je t’ai dis ne fonctionnera pas, c’est pour faire apparaitre ou disparaitre.

Par contre, j’ai trouver quelque chose 🙂

$(« #zoom_07 »).elevateZoom({
zoomType : « lens »,
lensShape : « round »,
lensSize : 200
});

9 juillet 2016 à 8 h 02 min #1062698
PhiLyon
Modérateur

Maître WordPress
28248 contributions
Bonjour.

Essaies-ça

Dans la page (en mode texte)

Dans le css
```
.zoom {
height:400px;
}
.zoom p {
text-align:center;
}
.zoom img {
width:200px;
height:267px;
}
.zoom img:hover {
width:300px;
height:400px;
}

/* Ou alors ça fais des essais */

.zoom {
height:400px;
}
.zoom p {
text-align:center;
}
.zoom img {
width:20%;
height:20%;
}
.zoom img:hover {
width:auto;
height:100%;
}
```
🙂
10 juillet 2016 à 17 h 49 min #1062699

Frank Lulla
Participant

Initié WordPress
26 contributions

Bonsoir les amis !

merci beaucoup des réponses, mais comme je ne m’y connais pas trop, je n’arrive toujours pas à réussir le zoom sur les images.

Dommage, mais j’ai essayé
Auteur

Messages