Newsletter Developpez.com

Inscrivez-vous gratuitement au Club pour recevoir
la newsletter hebdomadaire des développeurs et IT pro

ElevateZoom : une fonction de zoom sur images en jQuery

Le , par FirePrawn, Expert éminent sénior
Adeptes de jQuery, vous pourrez désormais implémenter une fonctionnalité de zoom d'image dans vos pages !

En effet, Elevatezoom.js est un plugin jQuery de zoom d'image à la façon constructeur automobile (je suis sûr que vous voyez de quoi je veux parler).

Ce plugin est entièrement personnalisable, dispose de larges teintes de couleurs, supporte les galleries Fancybox, permet un contrôle externe et différents types de zoom.
Pour finir il est entièrement libre étant édité sous les licences MIT et GPL.

Pour l'installer, rien de plus simple : il vous suffit de récupérer les sources et d'inclure le plugin en plus de jQuery dans votre page.

Pour l'utilisation c'est encore une fois simple comme bonjour : utilisez deux images comme ceci :

Code html : Sélectionner tout
<img id="zoom_01" src="small/image1.png" data-zoom-image="large/image1.jpg"/>

Il vous suffit ensuite d'activer le zoom (basique pour l'exemple) en javascript :

Code javascript : Sélectionner tout
$("#img_01").elevateZoom();

Et le tour est joué !
Pour voir plus d'exemples, vous pouvez consulter la page de démonstration.

Source : elevateweb.co.uk

Et vous ?

Que pensez-vous de ce plugin ?
Avez-vous déjà cherché à implémenter une telle fonctionnalité dans vos sites ?


Vous avez aimé cette actualité ? Alors partagez-la avec vos amis en cliquant sur les boutons ci-dessous :
Offres d'emploi IT
Responsable protection des données H/F
Safran - Ile de France - Magny-les-Hameaux (78114)
Responsable transverse - engagement métiers H/F
Safran - Ile de France - Corbeil-Essonnes (91100)
Ingénieur analyste programmeur (H/F)
Safran - Auvergne - Montluçon (03100)

Voir plus d'offres Voir la carte des offres IT
Responsable bénévole de la rubrique JavaScript : Xavier Lecomte -