Viewer - Einfaches Plugin für das Zoomen von Bildern für Vanilla JS & jQuery

Sie können eine schnelle Suche durchführen und Dutzende von Bibliotheken für Bild-Lightboxen, Diashows, Galerien finden.

Eine der neuesten Bibliotheken, die meine Aufmerksamkeit erregt hat, ist der Viewer. In der Version 0.6 befindet sich derzeit noch ein Projekt in der Entwicklung, aber dieses Image Plugins Design und Funktionen sind beide phänomenal.

Auf der Homepage finden Sie eine Live-Demo mit verschiedenen Bildstilen. Sie können wählen Stellen Sie Ihre eigene Galerie auf verschiedene Funktionen ein wie direktes Zoomen mit einem einzelnen Bild oder eine lange Diashow mit vielen Bildern.

Dies kommt auch mit einem “Inline-Modus” Damit wird der Bildbetrachter an ein Element auf der Seite angehängt. Also wenn der Benutzer klickt auf eine Miniaturansicht, um das Foto zu zoomen in diesem Element und nicht auf der gesamten Seite.

Hier finden Sie Schaltflächen für so ziemlich alles: Drehungen, zusätzliche Beschriftungen und 1: 1-Zoomen, um eine klare Ansicht der hochauflösenden Fotos zu erhalten.

Mit einigen JS-Optionen Sie entscheiden, wie das Viewer-Skript funktionieren soll. Sie möchten nicht, dass Besucher Bilder vergrößern können. Kein Problem.

Sie können auch die Diaschau-Funktion deaktivieren oder einfach die Schaltflächen Weiter / Zurück in der Benutzeroberfläche deaktivieren. Gleiches gilt für die Miniaturbilder Diese werden angezeigt, wenn die Diashow vollständig angezeigt wird.

Beachten Sie auch, dass dieses Skript eine Nicht-jQuery-Version hat, wenn Sie Vanilla JS bevorzugen. Beide Plugins arbeiten auf dieselbe Weise und sind beide in der aktiven Entwicklung. Alles, was Sie zur Anpassung dieser Benutzeroberfläche benötigen, finden Sie auf der Hauptseite von GitHub.

Wenn Sie Ihre eigenen UIs sehr gut programmieren möchten, ist der Viewer ein sehr cooles Plugin. Es bietet sich so an viel Kontrolle über das Verhalten jeder Diashow dass Sie dies in so ziemlich alles, was Sie wollen, umstrukturieren können.

Webentwickler werden einen Feldtag haben, der mit allen Optionen in diesem kostenlosen Bildskript arbeitet.