Hallo,
wir haben demnächst eine Veranstaltung unseres Sportvereins. Nun ist es gewünscht, dass beim Einstieg auf der Startseite das Plakat zur Veranstaltung sich automatisch in einer Lightbox öffnet und durch den User erst wieder geschlossen werden muss um die eigentliche Startseite zu sehen.
Ich weiß, das könnte lästig werden wenn man bei einem Besuch öfter auf die Startseite wechselt, aber wie könnte man das lösen?
Derzeit setzte ich die "perfect lightbox" ein, das muss aber nicht unbedingt sein.
Hat jemand eine Idee?
Schau mal ob das Script der Lightbox eine Funktion zur Verfügung stellt, mit der Du das öffnen der Lightbox erzwingen kannst. Vielliecht lässt sich per Javascript auch ein Klick simulieren?
EDIT Click simulieren mit jQuery:
$(document).ready(function() {
$('JQUERY SELEKTOR ZUM ELEMENT').trigger('click');
});
Demntsprechend könntest du dann auch per JS ein Cookie setztn ( zum Beispiel ) um zu verhindern, dass dein Plakat jedesmal öffnet wenn die Startseite abgesurft wird.
@Schweriner,
ja sowas in der Art hatte ich mir gedacht. Leider fehlen mir absolut die Kenntnisse in jQuery. Ich kann die Scripte zwar lesen und weitgehendst interpretieren, aber das bekomme ich nicht hin. Ein Script in den Header laden ist ja nicht das Problem, aber das war es dann auch schon.
Kannst Du mir da Hilfestellung geben?
Verstehe ich das richtig, dass ich das Bild einfach wie üblich über die Lightbox einbinde, so wie alle Anderen, die die User so anklicken und schaue dann im Quelltext nach, welche Funktion ein üblicher Klick zum Vergrößern ausführen würde?
@Chrissli
Unmittelbar nach dem Absenden der Frage hier im Forum ist mir die Sache mit nem Cookie auch eingefallen, das würde wohl bei den meisten Usern funktionieren. Da die Veranstaltung jedoch schon am 4.8 vorbei ist wäre ich mit dem Einarbeiten in Cookies wohl dann auch erst fertig. :-)
Aber Danke für den Tipp!
Moin,
genau so meine ich das. Du bindest das Bild wie ein normales Bild auf der Startseite ein, so das ein Benutzer es beim Klick vergrößern könntest. Zusätzlich bindest Du aber ein Script (s.o.) ein und simulierst damit beim Aufruf der Seite einen Klick durch den Benutzer, wodurch sich die Lightbox öffnen sollte.
Meistens ist ja um ein Lightbox Bild ein Link (a-Tag), auf welches Du den Klick simulieren müsstest.
Hallo Schweriner,
Ich schaffe das nicht. Also der Quelltext an der Stelle an dem sich das Plakat als Vorschau befindet sieht so aus:
<div style="width:190px;" class="csc-textpic-imagewrap csc-textpic-single-image">
<a rel="lightbox[lb]" href="uploads/pics/Plakat_60_Jahre_SV_Daugendorf.jpg">
<img width="190" height="75" alt="Einladung zum 60. Jübiläum des Sportverein Daugendorf" src="typo3temp/pics/Plakat_60_Jahre_SV_Daugendorf_9c2cb786f3.jpg">
</a>
</div>
Wie könnte ich jetzt den Klick mit deinem o.g. Script "ausführen"???
Vielen Dank für die Hilfe!
Kannst du dem Link / Plakat nicht noch einen etwas eindeutigeren Wert wie ID oder Klasse zuweisen?
Ein Klick auf allen Links bzw. Lighboxen auszuführen ist vermutlich nicht das Gelbe vom Ei, d.h. du man sollte über einen jQuery-Selektor das zu klickende Objekt identifizieren können.
Bzw. liegt das dieses Element als einzelnes in einem eindeutigen Container?
Hallo Chrissli,
ja klar. Ich habe jetzt nur dieses eine Contentelement in ein eigenes DIV mit der ID lightbox-autostart gepackt:
<div id="lightbox-autostart"> ... </div>
Jetzt müsste sich der Anchor ja eindeutig ansprechen lassen, oder?
Hier der komplette Quelltext:
<DIV ID="lightbox-autostart">
<H1>Einladung zum Jubiläum</H1>
<DIV CLASS="csc-textpic csc-textpic-center csc-textpic-above">
<DIV STYLE="width:190px;" CLASS="csc-textpic-imagewrap csc-textpic-single-image">
<A REL="lightbox[lb]" HREF="uploads/pics/Plakat_60_Jahre_SV_Daugendorf.jpg">
<IMG WIDTH="190" HEIGHT="75" ALT="blabla" SRC="typo3temp/pics/Plakat_60_Jahre_SV_Daugendorf_9c2cb786f3.jpg">
</A>
</DIV>
</DIV>
</DIV>
$(document).ready(function() {
$('#lightbox-autostart A').trigger('click');
});
bzw.
$(document).ready(function() {
$('#lightbox-autostart').find('A').trigger('click');
});
sollte eigentlich beides funktionieren.
Wobei ich bisher immer gedacht habe, dass die trigger('click')-Funktionalität auf onclick-Funktionen beschränkt ist. Aber man lernt ja nie aus.
Vielen Dank,
ich habe das mal auf dieser Seite eingebaut, leider tut sich gar nichts :-(
http://sv-daugendorf.de/startseite.html
ich vermute mal, dass du ein anderes Javascript hast, welcehs mit jQuery konkuriert, denn hinter der $-variable steckt bei dir irgendwas anderes.
Ersetze in der geposteten jQuery-Funktion einfach das "$" mit jQuery, also
jQuery(document).ready ... usw.
In deinem Fall (du fährst jQuery im noConflict-Mode) mußt du $ gegen jQuery austauschen.
Hallo,
vielen Dank für die Hilfe und ich kann mir gut vorstellen, dass ihr Besseres zu tun habt, als mir zu helfen, jedoch klappt das immer noch nicht. Hab es mit beiden Scripts von Chrissli probiert. Ich erhalte in Firefox auch keine Javascript Fehlermeldungen diesbezüglich.
Habt ihr noch eine Idee?
Die Reihenfolge der Scripte sollte schon korrekt sein,
momentan initialisierst du die Lightbox erst, nachdem dein Script ausgeführt wurde,
dat kann natürlich funktionieren.
Hallo jenses,
das leuchtet mir ein, so kann das sicher nicht funktionieren.
Habe daraufhin den Code mal in den Footer gelegt. Das funktionierte aber auch nicht. Deshalb jetzt wieder im Header, jedoch nun hinter der Lightbox und es tut sich leider immer noch nichts. o.O