Lightbox2 [automatisch]

[Nicknew]

Guten Morgän zusammen,

ich hab mich entschieden, die oben genannte Lightbox einzusaetzen.

Das klappt per Link auch wunderbar, wenn ich die Lightbox aber automatisch
beim aufrufen der Index.htm haben moechte, dann weiß ich leider garnet
wie ich das anstellen soll.

im Head-Bereich:

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

im Body-Bereich:

<a href="images/image-1.jpg" rel="lightbox" title="">Bild01</a>

Ich kenne mich Java, quasi null aus. Ich weiß zu mindestens, dass ich eine Funktion schreiben muss, hat vielleicht jemand die Guete und gibt mir ein Beispiel?

Gruss,
Nick

[suit]

Ich kenne mich Java, quasi null aus.

Macht nichts, Java brauchst du acuh nicht.

Ich weiß zu mindestens, dass ich eine Funktion schreiben muss, hat vielleicht jemand die Guete und gibt mir ein Beispiel?

Hast du die Dokumentationsseite der Lightbox angesehen?

btw: bist du dir sicher dass du ein Framework mit rund 135 KiB[1] (fast 5.000 Zeilen Code[1]) einsetzen willst, nur für eine simple Lightbox? Andere Frameworks machen sowas mit weitaus weniger Overhead, wenn es denn schon ein Framework sein soll.

[1] 1.7 hat mittlerweile etwa 155 KiB und fast 6.000 Zeilen Code.

[Nicknew]

Hm, dass war mir nicht bewusst.
Die Ladezeiten sollten schon, "gering" sein.

Hast du fuer mich ein Beispiel, bzw. eine Alternative fuer eine vergleichbare Loesung?

Gruss,
Nick

[suit]

Hast du fuer mich ein Beispiel, bzw. eine Alternative fuer eine vergleichbare Loesung?

Die Thickbox (jQuery) hat inklusive dem Framework etwa 30 KiB.

Highslide ist eine Standalone-Lösung mit variblen Features - das reicht dann von etwa 10 bis etwa 100 KiB - muss man sich überlegen.

Sehr minimal ist z.B. diese
Variante von Felix Riesterer, die müsste man halt visuell selbst etwas aufmotzen - die Grafiken sind nicht der bringer ;)

Beispiele gibts massig da draußen, ggf. suchst du einfach nach Lightbox klonen und vergleichst die Features ein bisschen.

[Shadowcrow]

'ǝɯɐu$ ıɥ

Sehr minimal ist z.B. diese
Variante von Felix Riesterer, die müsste man halt visuell selbst etwas aufmotzen - die Grafiken sind nicht der bringer ;)

Und funktioniert immer noch nicht richtig in Opera (jetzt 10.51)...

ssnɹƃ
ʍopɐɥs

[suit]

Und funktioniert immer noch nicht richtig in Opera (jetzt 10.51)...

Ist mir garnicht aufgefallen, ob da ein Overlay ist oder nicht stört mich nicht :)

[Nicknew]

Und funktioniert immer noch nicht richtig in Opera (jetzt 10.51)...

Ist mir garnicht aufgefallen, ob da ein Overlay ist oder nicht stört mich nicht :)

so ich habe die Thickbox in die Seite eingebaut, dass einzige was nicht erscheint ist das "LadeImage.gif" obwohl die Pfade meiner Meinung nach passen..

was ich sehr schade finde, dass meine Flash Animation im Hintergrund weiterlaeuft und zu sehen ist, gibt es noch eine Moeglichkeit das zu verhindern?

[Nicknew]

uebrigens, Kompliment an das Forum - ich habe mir hier schon oft
sehr nuetzliche Tipps und Tricks angeeignet. :)

[suit]

so ich habe die Thickbox in die Seite eingebaut, dass einzige was nicht erscheint ist das "LadeImage.gif" obwohl die Pfade meiner Meinung nach passen..

Da kann man dir ohne genauere Infos auch nicht helfen.

was ich sehr schade finde, dass meine Flash Animation im Hintergrund weiterlaeuft und zu sehen ist, gibt es noch eine Moeglichkeit das zu verhindern?

Wenn dein Flash über ein External Interface verfügt, kannst du beim Öffnen-Event der Thickbox das Flash stoppen und danach (beim Schließen) wieder starten.

[Nicknew]

der Head sieht so aus:

<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />

<style type="text/css" media="all">@import "thickbox.css";</style>
<script type="text/javascript" src="thickbox/jQuery.js"></script>
<script type="text/javascript" src="thickbox/thickbox.js"></script>

und in der thickbox.js habe ich das stehen:

var tb_pathToImage = "images/loadingAnimation.gif";

der Ordner "images" befindet sich im Unterordner von "thickbox"  und im Ordner
"images" befindet sich das .gif. Dann waere doch die Pfadangabe richtig, oder?

btw:

muss ich eine neue Function schreiben, wenn ich die thickbox beim aufrufen der Index haben moechte?

Gruss,
Nick

Ps. Danke Euch erstmal fuer die Hilfestellung.

[Shadowcrow]

'ǝɯɐu$ ıɥ

<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />

<style type="text/css" media="all">@import "thickbox.css";</style>

warum doppelt? sinn?

und in der thickbox.js habe ich das stehen:

var tb_pathToImage = "images/loadingAnimation.gif";

du hast meinen beitrag gelesen?

ssnɹƃ
ʍopɐɥs

[Nicknew]

Hallo,

äh ich gestehe, ich habe den scheinbar ueberlesen *schmunzel* ich versuche es direkt.

Feedback kommt sofort.

Warum doppelt, ich habe mich halt an die Anleitung gehalten.
Deswegen habe zweimal den Pfad drin.

Gruss,
Nick

[Nicknew]

Hallo,

äh ich gestehe, ich habe den scheinbar ueberlesen *schmunzel* ich versuche es direkt.

Feedback kommt sofort.

Warum doppelt, ich habe mich halt an die Anleitung gehalten.
Deswegen habe zweimal den Pfad drin.

Gruss,
Nick

hm, nun den doppelten Eintrag hab' ich rausgeschmissen. Die thickbox startet trotzdem, dann war der Eintrag tatsaechlich ueberfluessig.

[doofe Anleitung]

aber, ich hab' jetzt testweise den Absoluten Dateipfad in thickbox.js eingetragen: var tb_pathToImage = "http://www.domainnamen.info/thickbox/images/loadingAnimation.gif";

trotzdem starte das GIF nicht, irgendwie schon komisch.

[Shadowcrow]

'ǝɯɐu$ ıɥ

aber, ich hab' jetzt testweise den Absoluten Dateipfad in thickbox.js eingetragen: var tb_pathToImage = "http://www.domainnamen.info/thickbox/images/loadingAnimation.gif";

trotzdem starte das GIF nicht, irgendwie schon komisch.

Bist du sicher das das ding loadingAnimation.gif heißt und nicht loadinganimation.gif?

ssnɹƃ
ʍopɐɥs

[Nicknew]

yep, die Datei heißt wirklich so. "loadingAnimation" Ich bin mir hundertprozentig sicher! eigentlich schaue ich immer, dass ich case-sensitive
schreibe.

Hm, was koennte es denn noch sein?

Gruss,
Nick

[Nicknew]

yep, die Datei heißt wirklich so. "loadingAnimation" Ich bin mir hundertprozentig sicher! eigentlich schaue ich immer, dass ich case-sensitive
schreibe.

Hm, was koennte es denn noch sein?

Gruss,
Nick

was mich noch mehr schockiert, im IE-8 wird die Thickbox nicht korrekt dargestellt, dass Titel Feld fehlt voellig und das Close-Zeichen.
Das ist nicht gerade sehr User freundlich...

[Nicknew]

Guten Morgen zusammen,

ich moechte jetzt eine Testseite.htm automatisch wenn ich die Index-Seite
aufrufe starten lassen, dazu habe folgenden Code im Head:

<link rel="stylesheet" href="http://www.gartenspezialist.info/auto02/thickbox.css" type="text/css" media="screen" />

<script type="text/javascript" src="http://www.domain-namen.info/thickbox/jQuery.js"></script>  
<script type="text/javascript" src="http://www.domain-namen.info/thickbox/thickbox.js"></script>  

<script type="text/javascript">
         jQuery(function(){
           $(document).ready(function() setTimeout(function(){ tb_show('Vox Content', 'http://www.www.domain-namen.info/Testseite.htm?height=600& width=450', null);}, 2000);} );</script>

..aber es startet nichts, habe ich was vergessen?

Gruss,
Nick

[Nicknew]

Guten Morgen zusammen,

ich habe die Loesung gefunden, ich Idiot :/

Tja, dass einzige was wirklich nervt, ist das die Flash Animation im Hintergrund laeuft... aber das werde ich wohl nicht deaktivieren koennen.

Gruss,
Nick

[suit]

Tja, dass einzige was wirklich nervt, ist das die Flash Animation im Hintergrund laeuft... aber das werde ich wohl nicht deaktivieren koennen.

Wie schon gesagt: wenn du den Quelltext des Flash manipulieren kannst, bau ein External Interface ein - damit kann JavaScript mit dem Flash (bzw. ActionScript) kommunizieren (und umgekehrt).

[Nicknew]

Tja, dass einzige was wirklich nervt, ist das die Flash Animation im Hintergrund laeuft... aber das werde ich wohl nicht deaktivieren koennen.

Wie schon gesagt: wenn du den Quelltext des Flash manipulieren kannst, bau ein External Interface ein - damit kann JavaScript mit dem Flash (bzw. ActionScript) kommunizieren (und umgekehrt).

danke fuer die Hilfestellung, ich habe aber einen Workaround gefunden..
Ich hab das Fenster einfach groeßer gemacht, jetzt man die Flash-Animation
nicht mehr und so gefaellt es mir auch.

Was mir zu thickbox noch auffaellt, wenn man bereits:

<a class="menu-link" href="sitebla.html">Sitebla</a> im html Dokument hat

und man macht daraus:

<a class="menu-link" href="http://www.domain-name.info/Site2.html?keepThis=true&TB_iframe=true&height=650&width=400" title="Test" class="thickbox">Sitebla</a>

dann mag das die thickbox absolut nicht. Die thickbox startet einfach nicht,
warum, weil hier class="menu-link" und class="thickbox" im gleichen href stehen.

Jetzt kann ich zwar den Link zum Ziel mit der thickbox aufrufen, meine Formatierung (Link onMouseOver) geht aber verloren :(

[Shadowcrow]

'ǝɯɐu$ ıɥ

<a class="menu-link" href="http://www.domain-name.info/Site2.html?keepThis=true&TB_iframe=true&height=650&width=400" title="Test" class="thickbox">Sitebla</a>

Hä? Das ist doch falsch, so sollte es sein:

<a href="http://www.domain-name.info/Site2.html?keepThis=true&TB_iframe=true&height=650&width=400" title="Test" class="thickbox menu-link">Sitebla</a>

ssnɹƃ
ʍopɐɥs

[Nicknew]

du bist ein Genie, es geht *jubel* :D

[Shadowcrow]

'ǝɯɐu$ ıɥ

du bist ein Genie, es geht *jubel* :D

:-))

funtioniert das jetzt mit der loading animation?

ssnɹƃ
ʍopɐɥs

[Nicknew]

nein, dass Loading Gif wird leider immer noch nicht gestartet.

Testweise hatte ich den Absoluten Pfad zum Server, auf dem das Gif sich befindet verwendet, "http://jquery.com/demo/thickbox/images/loadingAnimation.gif" aber damit komme ich nicht weiter.

[Shadowcrow]

'ǝɯɐu$ ıɥ

nein, dass Loading Gif wird leider immer noch nicht gestartet.

Testweise hatte ich den Absoluten Pfad zum Server, auf dem das Gif sich befindet verwendet, "http://jquery.com/demo/thickbox/images/loadingAnimation.gif" aber damit komme ich nicht weiter.

hm, das ist merkwürdig, ich hab mit meiner und einem absoluten Pfad keine Probleme, kann es sein das die Bilder so schnell geladen werden das das gif deswegen nicht angezeigt wird?

ssnɹƃ
ʍopɐɥs

[Nicknew]

das kann natuerlich sein, die Seite dich per iFrame mit thickbox
eingebunden habe, ist genau 7KB groß.

[Shadowcrow]

'ǝɯɐu$ ıɥ

das kann natuerlich sein, die Seite dich per iFrame mit thickbox
eingebunden habe, ist genau 7KB groß.

AARGGHLLLL, ich könnt dich umbringen, sach das doch gleich, bei iframes wird die animation nicht eingeblendet (liegt in der natur der sache) NUR BEI BILDERN!!!

*lol* ich hätts mir denken können...

ssnɹƃ
ʍopɐɥs

[Nicknew]

achso, ja dass konnte ich nicht wissen. SORRRRYYYYY

Anfangs wollte ich ein Bild einfuegen, via Lightbox - als ich aber die Featueres der Thickbox gesehen habe, dachte ich mir - hm warum keine eigene html mit Flash einbinden.

Wusste ja net, dass dann kein Gif geladen wird...  :D

Aber trotzdem, ich habe wieder einiges von den Profis gelernt!

Vielen Dank dafuer!

[Nicknew]

uebrigens, fuer alle User die vielleicht die selbe Frage haben, mit dem
Script

<script type='text/javascript'>
$(document).ready(function() {
    tb_show('EXAMPLE','http://domain-namen.info/test.html?KeepThis=true&TB_iframe=true&height=650&width=800');
});
</script>

laesst sich die TB automatisch aufrufen, sobald die jeweilige Seite
angesteuert wird :D

[Shadowcrow]

'ǝɯɐu$ ıɥ

achso, ja dass konnte ich nicht wissen. SORRRRYYYYY

Anfangs wollte ich ein Bild einfuegen, via Lightbox - als ich aber die Featueres der Thickbox gesehen habe, dachte ich mir - hm warum keine eigene html mit Flash einbinden.

Jo, ich finde die Features der Thickbox auch ganz knuffig :-)

Wusste ja net, dass dann kein Gif geladen wird...  :D

Überleg dir mal was die Thickbox macht, bei Bildern dient die Animation als Platzhalter während das bild im Hintergrund geladen wird, bei einem iframe wird dieser ja sofort aufgebaut, mit dessen Inhalt der evtl. etwas länger laden könnte hat die Box nichts mehr zu tun (es ist ja auch ein eigenständiges Dokument).

Wenn du während das Flash lädt eine Animation haben willst könntest du das direkt im Flash tun.

Aber trotzdem, ich habe wieder einiges von den Profis gelernt!

Vielen Dank dafuer!

da nich für

ssnɹƃ
ʍopɐɥs

[Pragma]

Tja, dass einzige was wirklich nervt, ist das die Flash Animation im Hintergrund laeuft... aber das werde ich wohl nicht deaktivieren koennen.

Suits Vorschlag wäre der eleganteste, sofern dir das nicht möglich ist: Vorm Start der Thickbox das SWF ausblenden, nach dem Ausblenden der Thickbox das SWF wieder einblenden. Ich gehe mal stark davon aus, dass die Thickbox hierfür entsprechende Callbacks bereithält, bzw. womöglich sogar eine Option kennt, die das automatisch macht?!

[Shadowcrow]

'ǝɯɐu$ ıɥ

so ich habe die Thickbox in die Seite eingebaut, dass einzige was nicht erscheint ist das "LadeImage.gif" obwohl die Pfade meiner Meinung nach passen..

Da war doch was, Versuchs mal mit dem absoluten Pfad zb http://example.com/LadeImage.gif
Groß- und Kleinschreibung beachtet?

ssnɹƃ
ʍopɐɥs

[Nickne]

die Thickbox hatte ich mir nach deinem ersten Post ebenfalls schon angesehen, die wuerde fuer meine Zwecke voellig ausreichen.

Was mir aber wichtig ist, waere eine Funktion die einen automatischen aufruf beim "betreten der Seite" starten wuerde. Und ich denke da werde ich an meine Grenzen stossen, ohne JS Kenntnisse.

Gruss,
Nick

[suit]

Was mir aber wichtig ist, waere eine Funktion die einen automatischen aufruf beim "betreten der Seite" starten wuerde. Und ich denke da werde ich an meine Grenzen stossen, ohne JS Kenntnisse.

Das ist sicher nicht das Problem, mit entsprechenden Motivation wirst du dieses Manko im Forum recht schnell los - im Falle der Thickbox sind das afaik ein paar Zeilen (wenn überhaupt).

[Ole]

Hallo

es gibt auch die Möglichkeit eine Lightbox ohne JavaScript, nur mit CSS zu bauen.

Gruß
Ole