Bilder zoomen mit JavaScript

Vielleicht für den einen oder anderen hier mitlesenden Blogger oder Webmaster interessant: FancyZoom. FancyZoom zoomt die Bilder mittels JavaScript heran. Dies hat für mich den praktischen Nutzen, dass ich die hier eingeschränkte Größe der Screenshots sprengen kann. Klar hätte ich auf das Bild in Originalgröße verlinken können – aber das ist auch nicht so schick. Klickt einfach mal auf das Bild um zu testen:

Wie bindet man FancyZoom in eine vorhandenes WordPress ein (die Methode von Hand)? Ganz einfach – nachdem man das Paket heruntergeladen und entpackt hat kopiert man die beiden Ordner in den Standardordner eures Themes. Öffnet nun die Datei header.php und fügt folgenden Code ein.

Die automatische Methode: Benutzer eines WordPress-Blogs können auch dieses Plugin nutzen (Danke Max!).

In Zukunft werden alle Bilder (sofern ihr dies wollt) per schickem Zoom dargestellt. [via]

Gefällt dir der Artikel? Dann teile ihn mit deinen Freunden.

Hallo, ich bin Carsten! Ich bin gelernter IT-Systemelektroniker und habe das Blog 2005 gegründet. Seit 2008 ist es Beruf(ung). Baujahr 1977, Dortmunder im Norden, BVB-Fan und Vater eines Sohnes. Auch zu finden bei Twitter, Facebook, Instagram und YouTube. PayPal-Kaffeespende. Mail: carsten@caschys.blog

Neueste Beiträge

Mit dem Absenden eines Kommentars stimmst du unserer Datenschutzerklärung und der Speicherung von dir angegebener, personenbezogener Daten zu.

44 Kommentare

  1. Ich denke Patrick meint folgenden Code:

    meta http-equiv=“pragma“ content=“no-cache“

    Die Zeichen fürs öffnen und schließen des Meta-Tags müssen natürlich noch gesetzt werden.

  2. Ob die CSS nun sofort geladen wird oder erst irgendwann, ist doch wurscht. Der Inhalt wird ja trotzdem korrekt dargestellt.

    Bei mir wurde übrigens ohne neu laden Carstens Kommentar richtig in dem Türkis angezeigt. Ich hab einfach die Seite aufgerufen und alles war gut.

  3. Wäre ne Lösung 🙂
    Am besten wäre es aber tzrotzdem Softwareseitig, wenn einfach überprüft würde, ob die CSS-Datei auf dem Server neueren Datums ist.

  4. Keine Ahnung ob der Firefox das kann bzw. ob man das vielleicht sogar in der about:config festlegen kann, aber im Meta den Cache auszuschalten halte ich grundsätzlich für verkehrt. Denn dann werden ja auch ständig die ganzen Bilder neu geladen und das muss dann doch nicht sein, macht nur die Seite unnötig langsam.

    Außerdem müsste es meta http-equiv=“cache-control“ content=“no-cache“ heißen, laut http://www.swishzone.de/client/no-cache-meta-sinnvoll-6294.html
    Mit Pragma beeinflusst man wohl nur den Proxy.

  5. Nettes Plugin, hat Jemand das WP-PLugin erfolgreich getestet? Die händische Version funzt auf meinem lokalen WP 2.6 nicht…

  6. Muss händisch gehen. Haste es so eingebunden wie ich beschrieb?? Was geht nicht

  7. Genau so wie beschrieben, die zwei Ordner (images-global und js-global) in das Theme (./wp-content/themes/default-de)kopiert und den Text/Code in die header.php eingefügt.

  8. Schau mal, ob die Pfade in der HTML.js stimmen

  9. ???
    Welche HTML.js?

  10. Ich hatte selbst bei Korrektur des Pfades Probleme mit der Darstellung bzw. der nicht erfolgreichen Darstellung, habe es wieder gekickt, leider…

  11. > dann mach per Hand

    wie isn das gemeint?

  12. @Adolf
    „per Hand“==die erste beschriebene Methode
    NICHT die mit dem fertigen Plugin…
    …ich will jetzt nicht wissen was Du dir gedacht hast. 😉

    @Caschy
    Habe mal ohne lokal zu testen das WP Plugin genommen, geht wohl, jetzt muss ich nur noch auf 2.6… ^^
    Danke!

  13. Bei mir werden die Bilder im Zoom leider nicht richtig dargestellt. Weiß jemand Bescheid?

    Man beachte den Rahmen um das Bild herum: Beispiel

  14. Ich habe mal ein Tutorial für die „armen ;-)“ blogspot-User gebastelt, und zwar hier: http://dasgraueloft.blogspot.com/2008/07/fancy-zoom-fr-bloggercom-jetzt-aber.html

    Geht nämlich auch bei Blogger.com-Blogs 😉 Mit ein paar Tricks, versteht sich.

  15. Hatte neulich versucht manuell von Lightbox umzusteigen hat aber nicht so ganz geklapt. So werde ich heute mal das Plugin testen.

  16. Hallo,

    welches Plugin verwendest Du eigentlich für die Bilder (sieht nach einer Lightbox-Variante aus) in Deinem Blog?

    Viele Grüße,
    Stefan

  17. @Stefan: Steht doch im Beitrag, oder? 😉

  18. Vielen Dank vom blinden Maulwurf! 😉

  19. Öffnet nun die Datei header.php und fügt folgenden Code ein.

    Der Link geht nicht.

  20. Nabend

    Was muss ich GENAU bei der Version mit dem Plug-IN eingeben?
    Ich habe es installiert und WP hats auch erkennt, nur weiß ich nicht was ich eingeben muss, um ein Bild zu „zoomen“

Es werden alle Kommentare moderiert. Lies auch bitte unsere Kommentarregeln:

Für eine offene Diskussion behalten wir uns vor, jeden Kommentar zu löschen, der nicht direkt auf das Thema abzielt oder nur den Zweck hat, Leser oder Autoren herabzuwürdigen. Wir möchten, dass respektvoll miteinander kommuniziert wird, so als ob die Diskussion mit real anwesenden Personen geführt wird. Dies machen wir für den Großteil unserer Leser, der sachlich und konstruktiv über ein Thema sprechen möchte - gerne auch mit Humor.

Du willst nichts verpassen?

Neben der E-Mail-Benachrichtigung habt ihr auch die Möglichkeit, den Feed dieses Beitrags zu abonnieren. Wer natürlich alles lesen möchte, der sollte den Hauptfeed abonnieren.