27. Feb 2015
Die aktuelle ui.js unterstützt eine Lupenfunktion für Bilder, die sich sowohl per CSS als auch per jQuery aktivieren lässt.
Die aktuelle ui.js unterstützt eine Lupenfunktion für Bilder, die sich sowohl per CSS als auch per jQuery aktivieren lässt. Die Lupe selbst ist über CSS individuell gestaltbar.
Als Basis für das Lupenbild wird das HD-Bild genutzt, welches in doppelter Auflösung generiert vorliegt. Bei HD-Monitoren wird standardmäßig die gleiche Auflösung in doppelter Größe genutzt.
Fahren Sie über das folgende Bild, um die Lupenfunktionen zu sehen.
jQuery('img.pictureWithMagnifier').wMagnifier();
<img class="wglMagnifier" ...
.wMagnifier {cursor:none;z-index:999;background-color:#ffffff;border:solid 5px rgba(255, 255, 255, 0.8);box-shadow:0 0 8px 1px rgba(0, 0, 0, 0.6), inset 0 0 1px 0 rgba(0, 0, 0, 0.2);border-radius:100%;position:absolute;top:-60px;left:-60px;width:160px;height:160px}