Popup-Fenster öffnen

T

Tjarko

Hallo Forum,

ich bin zum ersten Mal in eurem Forum, weil ich eine Frage zum Tutorial von Dunsti „Neues Fenster per Klick öffnen (JavaScript)„ habe. Obwohl ich seiner Anleitung gefolgt bin, klappte es bisher leider noch nicht richtig. Irgend etwas mit dem Link scheint noch nicht zu stimmen.

Ich möchte erreichen, dass beim Klick auf eine kleine Grafik (Lupe-Icon) sich ein Popup-Fenster bestimmter Größe mit einem großen Foto öffnet.

Was ich bisher machte:
• Grafik eingebunden, z.B.:
<img src="http://www.tutorials.de/forum/images/link_lupe.gif" alt="Bild vergrößern" width="9" height="9" />

• Dieses Lupe-Icon mit einem Hyperlink versehen, der auf die Seite verweist, in der das vergrößert dargestellte Foto eingebunden ist (die Seite heißt z.B. grossbild.html. Daraufhin lautet jetzt der Code:
<a href="grossbild.html"><img src="http://www.tutorials.de/forum/images/link_lupe.gif" alt="Bild vergrößern" width="9" height="9" /></a>

• Für ein neues Popup-Fenster soll die komplette Funktion entsprechend seinem Tut für ein Fenster mit bestimmter Größe lauten:
<A HREF="" OnClick="javascript: fenster('datei.html','Titel',400,200)">

• Wenn ich das aber entsprechend meinen Gegebenheiten anpasse
<A HREF="" OnClick="javascript: fenster('grossbild.html','Titel',400,200)">
wird zwar irgendein Fenster geöffnet, nicht aber das gewünschte.

Meines Erachtens muss doch noch der Link auf das Icon irgendwie eingebunden werden. Wie wird das denn gemacht? Sorry, bin halt kein Crack….
Und/oder muss ich noch was zusätzlich berücksichtigen?
 
Tjarko hat gesagt.:
• Wenn ich das aber entsprechend meinen Gegebenheiten anpasse
<A HREF="" OnClick="javascript: fenster('grossbild.html','Titel',400,200)">
wird zwar irgendein Fenster geöffnet, nicht aber das gewünschte.
Zum Vergrößern anklicken....
Hi,

Code: 
<a href="#" onclick="fenster('grossbild.html','Titel',400,200)"><img src="./images/link_lupe.gif" alt="Bild vergrößern" width="9" height="9" /></a>
bzw.
Code: 
<a href="grossbild.html" onclick="fenster(this.href,'Titel',400,200);return false"><img src="./images/link_lupe.gif" alt="Bild vergrößern" width="9" height="9" /></a>


öffnet bei mir nicht irgendein Fenster, sondern das mit dem gewünschten Dokument.

mfg Maik
 
Hallo Maik,

danke für die Codes.
Mit dem ersten Code klappt es so nicht, da komme ich nur wieder auf meine index-Seite.
Mit dem zweiten Code funktioniert es nur halbwegs. In diesem Fall passiert folgendes:
1. Es öffnet sich kein neues Fenster, sondern das vergrößerte Bild wird anstelle des bisherigen Fensters dargestellt und
2. Das Fenster wird nicht in der Größe 400,200 dargestellt, sondern füllt den ganzen Bildschirm.

Woran kann das noch liegen?
Worin liegt übrigens der Unterschied beider Codes?
Was bedeutet bei dir im ersten Code die Raute "#" , der beim Code von Dunsti nicht enthalten ist?

Wäre schön, wenn du mir weiterhelfen könntest.
 
Hi,

dann ist die Ursache wohl in deinem Quellcode zu suchen, denn bei mir funktionieren beide Varianten in Verbindung mit der Script-Function fenster() aus dem Tutorial tadellos:

popup_variante1.jpg popup_variante2.jpg

Der Unterschied der Codes liegt darin, dass die erste Variante aktiviertes JS im User-Agent voraussetzt / erfordert, damit das im ersten open()-Parameter angegebene Verweisziel aufgerufen werden kann, somit erreichbar ist, und bei deaktiviertem JS das Dokument / die Datei in der zweiten Variante weiterhin über das href-Attribut des a-Elements im Browser aufrufbar ist.

mfg Maik
 
Der entsprechenden Code sieht bei mir so aus:

<a href="pca_bdm_0811.html" onclick="fenster(this.href,'Titel',820,640);return false"><img src="./images/link_lupe.gif" alt="Bild vergrößern" width="9" height="9" /></a>
und bewirkt das beschriebenen Verhalten.
Ich habe es anstelle "this" auch mit "new" erfolglos versucht.

Vielleicht kannst du mir trotzdem noch meine Fragen kurz beantworten, die ich oben stellte, vielleicht komme ich dann weiter...

Ist eventuell im header-Bereich etwas zusätzlich zu berücksichtigen?
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück