Intégrez un zoom sur vos images très simplementGrâce à ce nouveau plugin jQuery
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 lu gratuitement 6 articles depuis plus d'un an.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.