Viewer - Plugin de zoom sur une image simple pour Vanilla JS & jQuery

Vous pouvez faire une recherche rapide et trouver des dizaines de bibliothèques pour les images, les diaporamas, les galeries, etc..

Une des bibliothèques les plus récentes qui a attiré mon attention est Viewer. Actuellement dans la version 0.6, c'est toujours un projet en développement, mais cette image la conception et les fonctionnalités du plugin sont tous deux phénoménaux.

Sur la page d'accueil, vous trouverez une démonstration en direct avec différents styles d'image. Vous pouvez choisir de définir votre propre galerie à différentes fonctionnalités comme le zoom direct avec une seule image ou un long diaporama contenant de nombreuses images.

Cela vient aussi avec un “mode en ligne” qui relie la visionneuse d'images à un élément de la page. Alors quand le l'utilisateur clique sur une vignette pour agrandir la photo à l'intérieur de cet élément plutôt qu'en haut de la page.

Vous trouverez des boutons pour à peu près tout: rotations, légendes supplémentaires et zoom complet 1: 1 pour une vue nette des photos haute résolution.

Avec quelques options JS vous décidez comment le script Viewer devrait fonctionner. Vous ne voulez pas laisser les visiteurs zoomer sur les images? aucun problème.

Vous pouvez également désactiver la fonction de diaporama ou simplement désactiver les boutons next / prev de l'interface utilisateur. Même chose pour le photos miniatures qui apparaissent lorsque le diaporama est en plein écran.

Notez également que ce script a une version non jQuery si vous préférez JS vanille. Les deux plugins fonctionnent de la même manière et ils sont tous les deux en développement actif. Tout ce dont vous avez besoin pour personnaliser cette interface se trouve sur la page principale de GitHub..

Si vous voulez vraiment coder vos propres interfaces utilisateur, Viewer est un plugin très cool. Il offre donc beaucoup de contrôle sur le comportement de chaque diaporama que vous pouvez restructurer cela en à peu près tout ce que vous voulez.

Les développeurs Web passeront une journée sur le terrain à travailler avec toutes les options de ce script gratuit.