20 novembre 2009

Plugin jQuery : JQZoom, zoom sur une image

Plugin jQuery : JQZoom, zoom sur une imageVoici un plugin jQuery fort intéressent puisqu’il va permettre à l’utilisateur de zoomer sur une partie d’une image.

Intéressant donc pour les sites de ventes en lignes ou même pour ceux voulant exposer leurs photos, …


Son utilisation est simple mais il vous faudra 2 images :

  • l’une qui sera afficher normalement,
  • l’autre, forcement plus grande, ne sera affichée qu’en partie.

Ce qui donnera une structure comme suit :

<a href="images/BIGIMAGE.JPG" class="MYCLASS"  title="MYTITLE">
    <img src="images/SMALLIMAGE.JPG" title="IMAGE TITLE"  />
</a>

Après application du plugin, le résultat est le suivant :

Lorsque la souris se promène sur l’image, un bloc apparait ici sur sa droite ne montrant que la partie correspondante mais à partir de la grande image. D’où l’effet de zoom ;)

Plugin jQuery : JQZoom, zoom sur une image

L’exemple ici utilise donc ici 2 images :

  • la première faisant 251px de hauteur et 335px de largeur,
  • et celle qui sert pour zoomer fait 828px de hauteur pour 1105px de largeur :)

Pleins de paramètres sont ici possible, des dimensions de la zone zommée à l’effet pour faire apparaitre celle-ci, en passant par sa position par rapport à l’image « normale ».

Lien :

BlogBang

Un commentaire

  1. [...] : Révelez les détails de vos images. Plugin jQuery : JQZoom, zoom sur une imageTweetez-le !Partagez-le sur FacebookPartagez-le sur del.icio.usTomber sur un bon truc ? Partagez cet [...]

Déposez un commentaire





Additional comments powered by BackType