Comment faire un effet de zoom au passage de la souris sur une photo?
Je vois ce que tu veux Marty...
Cet effet est très utilisé dans les sites e-commerce par exemple pour mettre en valeur les photos des produits, Voici Zoomy ! C'est un plugin jQuery permettant d'ajouter une loupe sur tes images..Très simple à mettre en place et à utiliser, Zoomy permettra à tes visiteurs de voir plus en détail les images de tes sites que tu auras sélectionné.
Côté options, il est possible:
- De changer la taille de la loupe
- De changer la forme de la loupe (Carrée ou ronde)
- D'activer ou non l'effet d'éclat de la loupe
- Changer le texte incitant à cliquer sur l'image pour ouvrir la loupe
1.
<
a
href
=
"zoomImg.jpg"
class
=
"zoom"
>
2.
<
img
src
=
"displayImg.jpg"
alt
=
"This is the Display Image"
/>
3.
</
a
>
1.
$(
'.zoom'
).zoomy({
2.
zoomSize: 180,
3.
round:
true
,
4.
glare:
true
,
5.
zoomText: click to Zoom
6.
});
Le plugin utilisant du CSS3 pour le rendu de la loupe, sur Internet Explorer, tu devra te contenter de la loupe carrée.
Site Officiel de Zoomy
Super mais il en existe d'autres non?
Oh oui! voici un site en anglais qui donne 25 autres plugins de zoom
...dernière minute avant de poster ce message, j'ai trouvé mind-projects.it où il y a également des plugins de cet effet et... gratuits!
Aucun commentaire:
Enregistrer un commentaire