onblur Alternative?

[Forumsgast]

Hallo
Ich wollte ein Fenster machen wie bei Facebook wenn man auf "Konto" klickt. Das heißt beim klick öffnet es sich und sobald man irgendwo anders hinklickt verschwindet es wieder.
Den Javascript fürs anzeigen habe ich schon. Mein Code sieht momentan so aus : <a href="javascript:anzeigen('box')" onblur="javascript:anzeigen('box')">Text</a>.
Das Problem bei diesem Code ist, dass die Box auch verschwindet, wenn man in die Box klickt.

Ich hoffe ihr versteht alles.

Danke schonmal

--Matz

[Forumsgast]

Registier einen Klick-Handler aufs window object, check das event.target und wenn der Klick außerhalb des Layers erfolgte, schließt du diesen.

[Forumsgast]

Bin zwar nicht bei FB, aber das wird wohl eine Lightbox-Variante sein.

[Forumsgast]

also ist nix wie lightbox sondern eher eine <div> Box.

@rudygotya: habe so gut wie nix verstanden Also ich muss dazu sagen: schreiben kann ich nur html und CSS.

[Forumsgast]

vielleicht langt es, wenn du einen button zum schließen definierst und auf den klick ausserhalb verzichtest?

[Forumsgast]

das wäre natürlich eine Alternative. Jedoch wäre es ohne dieses Hilfsmittel natürlich deutlich besser.
Ich wusste nicht, dass es so kompliziert sei.

[Forumsgast]

Ich woass selba nit wies geht.

[Forumsgast]

Dann ist es halt ne lightbox mit transparentem Hintergrund.

[Forumsgast]

nee Lightbox ist schon was Anderes. die öffnet sich auch ohne Animation oder sowas. Gibt es da keinen einfacheren Code für?

[Forumsgast]

Lightboxes können auch ohne Animation konfiguriert werden.

[Forumsgast]

Hallo
Ich wollte ein Fenster machen wie bei Facebook wenn man auf "Konto" klickt. Das heißt beim klick öffnet es sich und sobald man irgendwo anders hinklickt verschwindet es wieder.
Den Javascript fürs anzeigen habe ich schon. Mein Code sieht momentan so aus : <a href="javascript:anzeigen('box')" onblur="javascript:anzeigen('box')">Text</a>.
Das Problem bei diesem Code ist, dass die Box auch verschwindet, wenn man in die Box klickt.

Ich hoffe ihr versteht alles.

Danke schonmal

--Matz

Wrapper sind keine "Passt scho irgendwie"-Spielzeuge

<a href="#" onClick="anzeigen('box');" onblur="anzeigen('box');">Text</a> 

Bist du schonmal auf die Idee gekommen onMouseOut Events von der Box selbst zu nutzen ?

[Forumsgast]

ja. das Problem ist, die Box hat selbst verschachtelte <div>s. darum klappt das weder mit onmouseout noch mit onfocus!
geht mal auf die Seite http://ahserviceteam.de/3/. Der testaccount ist: Tester - PW: tester.
rechts oben "Profil" und diese Box ist gemeint.

Mein Code dazu:

<div onmouseout="anzeigen('profil', false);" >
<div id="profil"style="display:none;background-image:url(http://img.webme.com/pic/v/vbanana/profilbox.png);width:150px;min-height:99px;position:absolute;z-index:1;left:50%;top:14px;margin-left:287px;"><div style="text-align:right;padding-top:7px;padding-right:11px;"> <font style="font-size:14px;color:#000;text-shadow:1px 1px 2px #FFF;text-align:right;font-weight:bold;">Profil</font></div>
<div style="background-color:#ccc;border-right:1px solid #333;border-bottom:1px solid #333;border-left:1px solid #333;margin-top:23px;">
<div class="menupunkt"><a href="{U_DOWNLOADS}" title="{L_DOWNLOADS}">{L_DOWNLOADS}</a></div>
<div class="menupunkt"><a href="./ucp.php?i=174">Einstellungen</a></div>
<div class="menupunkt"><a href="./ucp.php">Persönlicher Bereich</a></div>
<div class="menupunkt"><a href="{U_LOGIN_LOGOUT}">Abmelden</a></div>
</div>
</div>
</div>

<a href="#" onfocus="anzeigen('profil', true);"><div class="menu">Profil</div></a>

[Forumsgast]

Das HTML sieht gar grauenhaft aus, macht keine Freude den code zu lesen.

Desweiteren solltest du keine Eventhandler als Attribute in HTML Tags schreiben. Entweder du verwendest einen Evenlistener, oder machst in einer window.onload Function.

Ok zum wesentlichen. Du musst einen DIV einblenden nachen einem Event und in diesem ist dann drin was du brauchst. Ich mache das bei mir so (hat aber auch noch seine Macken) das, dass was das tranzparente darstellt ja der Rahmencontainer ist als komplett neuen Knoten im DOM erzeuge. So wenn ich dann Formulare oder weiß der Geier was rein laden will hole ich dir mir mit einem AJAX Request. So kann ich das flexibel nutzen. Es geht ganz sicher auch noch anders, ich bin das auch grad am ausfrickeln, weil mir das mit Ajax so auch nicht gefällt.

Über das target musst du dich dann durch das ganze Gebilde durchblubbern. Das heißt das oberste Parent ist der Container der für das tranzparente abdunkeln verantwortlich ist. Und wenn genau in dem und nur in dem, also nicht in einem seiner Kinder ein Klick passiert, dann schliest du das ganze Ding.

Ich hoffe das hilft dir ein wenig weiter.

Gruß Litter