PixelQuäler
Grünschnabel
Hallo zusammen,
ich habe in einem Wordpress-Theme PrettyPhoto eingebaut. Funktioniert auch alles soweit.
Ich würde aber auch gerne die Kommentarfunktion von Wordpress für die Bilder nutzen. Dazu kann man ja in PrettyPhoto z.B. im Alt-Attribute des Img-Tags einen Link ablegen:
Man kann in dem Link aber nicht so ohne weiteres auch einen onClick-Event definieren, und man kann auch keine Strings an Javascript-Funktionen übergeben, da ein href- oder onClick-Attribut ja schon ein String in einem String ist. Somit bin ich bei folgendem Workaround gelandet:
Für jeden KommentarLink erstelle ich einen normalen TextLink der mittels css unsichtbar ist. Die TextLinks haben eine unique ID. Im ALt-Attribute des Img-Tags wird eine JavaScript-Funktion aufgerufen und ihr wird die WordPress-ID des Bildes übergeben (als ZAHL!). Die WordPress-ID des Bildes ist identisch mit der TextLink-ID. In der Funktion wird dann einfach per jQuery API ein Click auf den Link ausgelöst.
Funktioniert alles! Was aber nicht funktioniert ist das Beenden der aktuell laufenden PrettyPhoto-Gallery und das laden der gewünschten Iframe-Seite.
Wenn man PrettyPhoto nicht explizit beendet per jQuery.prettyPhoto.close() funktioniert es überhaupt nicht. Jetzt schließe ich PrettyPhoto, lade es sogar noch einmal komplett neu, aber trotzdem steigt es dann vor dem Laden der Iframe-Seite mit einem JS-Fehler aus: "settings is not defined"
Ich habe eine OnlineDemo hier: gallerytest-mit-prettyphoto-slideshow
Der PrettyPhoto-Code steht unten in der Seite drin.
Vermutlich hat es etwas zu tun mit den Bereichen in denen Variablen gelten, aber sicher bin ich mir nicht. Auf jedenfall ist die Zeile in der settings nicht definiert sei soll nicht die erste Zeile in der darauf zugegriffen wird. (Definitiv zu hoch für meine geringen Javascript-Kenntnisse)
Die normalerweise nicht sichtbaren Textlinks sind jetzt zum Testen natürlich sichtbar unter den Thumbnails. Die funktionieren auch einwandfrei. Nur das Beenden und Neustarten von PrettyPhoto bzw das wechseln aus einer Gallery heraus auf eine einzelne Iframeseite funktioniert nicht.
Vielleicht kennt sich ja hier jemand genug mit PrettyPhoto aus um den Fehler zu erkennen oder auch gerne einen anderen Weg zum gewünschten Ziel zu zeigen.
Beste Grüße,
PixelQuäler
ich habe in einem Wordpress-Theme PrettyPhoto eingebaut. Funktioniert auch alles soweit.
Ich würde aber auch gerne die Kommentarfunktion von Wordpress für die Bilder nutzen. Dazu kann man ja in PrettyPhoto z.B. im Alt-Attribute des Img-Tags einen Link ablegen:
HTML:
<a rel="prettyPhoto[gallery]" href='.....' title='.....'><img src="...." alt="<a href='javascript:call_commentpage(21);'>Kommentiere</a>" /></a>Man kann in dem Link aber nicht so ohne weiteres auch einen onClick-Event definieren, und man kann auch keine Strings an Javascript-Funktionen übergeben, da ein href- oder onClick-Attribut ja schon ein String in einem String ist. Somit bin ich bei folgendem Workaround gelandet:
Für jeden KommentarLink erstelle ich einen normalen TextLink der mittels css unsichtbar ist. Die TextLinks haben eine unique ID. Im ALt-Attribute des Img-Tags wird eine JavaScript-Funktion aufgerufen und ihr wird die WordPress-ID des Bildes übergeben (als ZAHL!). Die WordPress-ID des Bildes ist identisch mit der TextLink-ID. In der Funktion wird dann einfach per jQuery API ein Click auf den Link ausgelöst.
Code:
function call_commentpage(id)
{
jQuery.prettyPhoto.close();
start_PP();
jQuery('#cpid' + id).click();
}Funktioniert alles! Was aber nicht funktioniert ist das Beenden der aktuell laufenden PrettyPhoto-Gallery und das laden der gewünschten Iframe-Seite.
Wenn man PrettyPhoto nicht explizit beendet per jQuery.prettyPhoto.close() funktioniert es überhaupt nicht. Jetzt schließe ich PrettyPhoto, lade es sogar noch einmal komplett neu, aber trotzdem steigt es dann vor dem Laden der Iframe-Seite mit einem JS-Fehler aus: "settings is not defined"
Ich habe eine OnlineDemo hier: gallerytest-mit-prettyphoto-slideshow
Der PrettyPhoto-Code steht unten in der Seite drin.
Vermutlich hat es etwas zu tun mit den Bereichen in denen Variablen gelten, aber sicher bin ich mir nicht. Auf jedenfall ist die Zeile in der settings nicht definiert sei soll nicht die erste Zeile in der darauf zugegriffen wird. (Definitiv zu hoch für meine geringen Javascript-Kenntnisse)
Die normalerweise nicht sichtbaren Textlinks sind jetzt zum Testen natürlich sichtbar unter den Thumbnails. Die funktionieren auch einwandfrei. Nur das Beenden und Neustarten von PrettyPhoto bzw das wechseln aus einer Gallery heraus auf eine einzelne Iframeseite funktioniert nicht.
Vielleicht kennt sich ja hier jemand genug mit PrettyPhoto aus um den Fehler zu erkennen oder auch gerne einen anderen Weg zum gewünschten Ziel zu zeigen.
Beste Grüße,
PixelQuäler
