"popup" mit CSS

[frankx]

Hallo,

bei manchen Infos finde ich es ja sinnvoll, kleine Fensterchen zu benutzen (zB. Kurzinfos oder Kontaktfenster). Mit Javascript ja kein Problem. 2 Fragen bezüglich dazu: wie sieht denn ein Javascript-Link zusammen mit einem HMTL-Link aus (von wegen barrierefrei cascadisch). Und mit css und visibility und z-index und position absoulte "verankert" im bodytag geht es ja bestimmt, soweit ich kapiert, wie aber sieht dann der link ohne js aus. beim hovern würde es gehen mit a:hover und dann visibility ändern, wenn das als <span> im Anker eingebaut ist (dank Ingo Turksi), aber onclick geht doch nur mit JS, oder hab ich da jetzt eine Sperre oder Wissenslücke im Hirn (meins ist scheinbar auch nicht barrierefrei);

Dank Frankx

[Ingo Turski]

Hi,

wie aber sieht dann der link ohne js aus. beim hovern würde es gehen mit a:hover und dann visibility ändern, wenn das als <span> im Anker eingebaut ist (dank Ingo Turksi), aber onclick geht doch nur mit JS

korrekt. Es gibt kein CSS-Äquivalent zu onclick. :active würde im IE den gewünschten Effekt bringen, aber in strandardkonformen Browsern halt nur bis zum Loslassen der Maustaste reichen.

Einzige barrierefreie Möglichkeit wäre, eine vorhandene HTML-Seite als Linkziel einzutragen, die dann bei deaktiviertem Javascript aufgerufen werden kann.

freundliche Grüße
Ingo

[frankx]

Hallo und Dankeschonwieder Ingo,

Einzige barrierefreie Möglichkeit wäre, eine vorhandene HTML-Seite als Linkziel einzutragen, die dann bei deaktiviertem Javascript aufgerufen werden kann.

genau da die 2. Lücke:

<a href="test.htm" onclick="javascript:window.open('test.htm', 'Fenster1', 'width=310,height=400,left=0,top=0')">link</a>

geht ja nicht, weil denn ändert sich ja das "opener"-Fenster auch, da steht jetzt "#" drinne...;

Dank Frankx

[Felix Riesterer]

Lieber frankx,

<a href="test.htm" onclick="javascript:window.open('test.htm', 'Fenster1', 'width=310,height=400,left=0,top=0')">link</a>

geht ja nicht, weil denn ändert sich ja das "opener"-Fenster auch, da steht jetzt "#" drinne...;

schmeiß das "javascript:" aus dem onclick-Attribut raus, denn da hat es nüscht verloren! Zusätzlich solltest Du nach der window.open()-Answeisung ein "return false" notieren, damit im opener-Fenster alles so bleibt, wie es ist. Das sieht dann insgesamt so aus:

<a href="test.htm" onclick="window.open('test.htm', 'Fenster1', 'width=310,height=400,left=0,top=0'); return false;">link</a>

Liebe Grüße aus Ellwangen,

Felix Riesterer.

[Ingo Turski]

Hi,

Zusätzlich solltest Du nach der window.open()-Answeisung ein "return false" notieren, damit im opener-Fenster alles so bleibt, wie es ist. Das sieht dann insgesamt so aus:

<a href="test.htm" onclick="window.open('test.htm', 'Fenster1', 'width=310,height=400,left=0,top=0'); return false;">link</a>

oder - noch einen Tick besser - so den Rückgabewert aus der Funktion übernehmen.

freundliche Grüße
Ingo

[Felix Riesterer]

Lieber Ingo,

oder - noch einen Tick besser - so den Rückgabewert aus der Funktion übernehmen.

prinzipiell mache ich das ja auch so, aber wenn  frankx keine extra Funktion definiert (wie Du das gemacht hast), sondern die window.open()-Methode direkt aus dem Eventhandler heraus aufruft, dann bleibt es wohl besser bei dem return false im onclick-Attribut. Was meinst Du?

Liebe Grüße aus Ellwangen,

Felix Riesterer.

[Ingo Turski]

Hi,

aber wenn  frankx keine extra Funktion definiert (wie Du das gemacht hast), sondern die window.open()-Methode direkt aus dem Eventhandler heraus aufruft, dann bleibt es wohl besser bei dem return false im onclick-Attribut. Was meinst Du?
ich meine nicht, sondern teste es einfach..;-)

Wenn ich mein Popup-Beispiel über
<a href="popup.html" onclick="return !window.open(this.href)">Demo</a>
aufrufe, dann öffnet sich die Seite bei deaktiviertem Javascript auch normal, allerdings liefert open z.B. im Opera bei Blockierung aller Popups leider auch true, so daß es in der Tat wohl keinen Vorteil bringt - außer daß man sich das "false" spart. ;-)

freundliche Grüße
Ingo