xZoom Jquery Bild Zoom Effekt
xZoom ist eine Jquery-Bibliothek, die erstellt wurde, um Bildern auf Websites einen Zoom-Effekt zu verleihen. Es ist sehr einfach zu bedienen, da es responsive unterstützt wird, auf mobilen Geräten effizient funktioniert und mit den meisten Webbrowsern kompatibel ist.
Da es je nach Bedarf personalisiert werden kann, hat es eine vorteilhaftere Verwendung. Obwohl der Zoom-Effekt im Allgemeinen zum Zoomen von Galeriebildern auf E-Commerce-Sites verwendet wird, kann er auch auf Blog-Sites oder anderen Content-Sites verwendet werden. Darüber hinaus verfügt die xZoom-Bibliothek über das Apache License 2.0-Zertifikat.
xZoom-Effekttypen
Es gibt 5 verschiedene Zoom-Effekte, die von der Bibliothek bereitgestellt werden.
1. Default Options
Dieser Effekt ermöglicht auf einfachste Weise das Zoomen neben das bestehende Bild. Zusätzlich kann für jedes Bild eine Beschriftung unter das Bild geschrieben werden. Das Zoomverhältnis des Bildes ändert sich, wenn das mittlere Mausrad während des Zoomeffekts verwendet wird.
2. Output Window
Im Vergleich zum vorherigen Effekt zeigt er den vergrößerten Bildschirm kleiner an. Der Beschreibungstitel kann bei diesem Effekt nicht unter das Bild geschrieben werden.
Hinweis: Der Zoom-Bildschirm erscheint normalerweise direkt rechts neben den Bildern, aber da das Beispiel auf Jsfiddle.net projiziert wird, wird es in einem schmalen Bereich angezeigt, sodass der Zoom-Bildschirm nach unten verschoben wird.
3. Lens Options
Die Linsenoption hat einen Vergrößerungseffekt. Die Größe der Linse kann mit dem mittleren Rad der Maus oder dem Touchpad angepasst werden.
4. With FancyBox
Wenn der Benutzer im With FancyBox-Effekt die Maus über das Bild zieht, wird das Bild vergrößert. Wenn Sie auf das Bild klicken, öffnet es das angeklickte Bild in einer größeren Größe. Außerdem ist es möglich, vom geöffneten Großbild zu anderen Bildern zu wechseln.
5. With Magnific Pop-up
Der Unterschied zwischen dem FancyBox-Effekt und dem Magnific Pop-up-Effekt besteht darin, dass beim zweimaligen Antippen des Vollbild-Zooms, der sich mit einer Berührung in der mobilen Ansicht öffnet, ein Pop-up-Zoom-Effekt auftritt. Aber diese Ansicht tritt nicht im FanycBox-Effekt auf.
xZoom-kompatible Browser
- IE6+
- Chrome
- Firefox
- Opera
- Safari
Verweise:
https://payalord.github.io/xZoom/