Aug. 19

Fantastische Lupenfunktion

Tag: Javascript — Patrick @ 12:40 pm

Christian Effenberger veröffentlichte auf seiner Seite netzgesta.de ein Skript um sehr cool aussehende Lupeneffekte relativ einfach in eigene Homepage einzubauen.

Alles was man dazu benötigt ist sein loupe.js, das aktuell in Version 1.3 vorliegt und für nicht-kommerielle und private bzw. Schulungszwecke frei verfügbar ist.

Zum Einbau müssen die folgenden Zeilen Code in den Head-Bereich eingefügt werden:

// only if the image "loupe.png" is not in the current path
<script type="text/javascript">var loupePath="imagepath/";</script>
// else only this lines...
<script src="loupe.js" type="text/javascript"></script>
<!--&#91;if gte IE 6&#93;>
<script type="text/javascript">var loupePath="vml/";</script>
<script type="text/javascript" src="vml/loupe.js"></script>
<!&#91;endif&#93;-->

Um die Lupenfunktion hinzuzufügen, wird ein onload=“initLoupe(this.id);“-Ereignis auf ein von einem div umschlossenes Bild gesetzt.

<img src="..." id="..." onload="initLoupe(this.id);" alt="..." width="356" height="205" />

Die Lupengrafik lässt sich problemlos ersetzen und den eigenen Vorlieben und Website-Motiven anpassen.

loupe.js funktioniert in allen größeren Browsern (Firefox 1.5+, Opera 9+, Safari und IE 6+). Ältere Browser ignorieren die Anweisungen einfach.

loupe_homer.png loupe_monalisa.png loupe_karte.png

4 Antworten zu “Fantastische Lupenfunktion”

  1. mmm sagt:
    August 4th, 2010 at 1:40 pm

    hello

  2. Ernst Gruber sagt:
    Mai 5th, 2014 at 7:40 am

    Hallo Christian,

    vielen, vielen Dank für die „Fantastische Lupenfunktion“.

    Seit Wochen klappere ich Google ab, um eine verständliche und auch noch brauchbare Zoom-Lupe zu finden. Es gibt zwar schon einige „Darstellungen“ für Spezialisten, aber ohne Fachkenntnisse ist man da einfach hilflos.

    Nun habe ich zufällig Deine Seiten entdeckt und es hat geklappt. Mit dem Ergebnis bin ich sehr zufrieden.

    Seit 2001 habe ich hauptsächlich für meine Urlaubsbilder eine eigene Homepage. Meine Bekannten können sich dann, wenn sie gerade Lust dazu verspüren, die Fotos und die hinzugefügten Informationen anschauen. Aber auch ich sehe mir gerne meine alten Urlaubsberichte an und überlege mir dabei, was ich noch verbessern könnte. So zum Beispiel möchte ich zukünftig, wenn es Sinn macht, die Lupenfunktion einbauen.

    Eine Frage hätte ich noch dazu: Kann man den „Lupen-Schalter“ auch außerhalb des Bildes unterbringen?
    Wenn ja, ich würde mich über eine Lösung sehr freuen.

    Hier das bisher einzige Ergebnis meiner Bemühungen:

    http://www.ev-er.de/homepage_neu/Portugal13/Blatt_238.html

    Nochmals vielen Dank für die Anweisung zur Installation.
    Herzliche Grüße von
    Ernst

  3. wolfgang sagt:
    Oktober 18th, 2014 at 7:55 am

    Hallo Christian, ich kriege das nicht hin. Kannst Du das in meine Homepage einbauen.
    LG
    wolfgang

  4. wolfgang sagt:
    Oktober 19th, 2014 at 10:23 am

    Ich möchte das auf meiner Homepage gerne haben, kriege es aber nicht hinn

Hinterlasse einen Kommentar

You must be logged in to post a comment.