iFrame erzeugen mit Javascript

folio

Erfahrenes Mitglied
Hi,

ich habe ein Problem mit Javascript. Habe auch schon wirklich ausführlich gegoogelt und bin bis zur 6. Ergebnisseite vorgedrungen, aber das Problem war immer nur so ähnlich gelöst worden.

Also folgendes:

Ich habe auf meiner Homepage einen Link:
Code:
<a href="#" onclick="vorschau('http://www.ebay.de')">Vorschau anzeigen</a>

Wenn der Besucher jetzt auf diesen Link klickt, soll sich ein neuer iFrame mit ebay.de öffnen. Am besten ist der iframe vorher nicht zu sehen. Der iFrame soll ca. 400 Pixel breit und 300 Pixel hoch sein.

Hab ich das verständlich erklärt...? Würde mich sehr über Hilfe freuen :)

Edit: habe noch vergessen, ich würde dann auf der Seite einen Marker einfügen für die Stelle, an der der iFrame erscheinen soll.
 
Zuletzt bearbeitet:
Hi.
Wenn der Besucher jetzt auf diesen Link klickt, soll sich ein neuer iFrame mit ebay.de öffnen. Am besten ist der iframe vorher nicht zu sehen.
Na, dann wird dieser iFrame zunächst per display:none oder visibility:hidden im Dokument versteckt, und beim Klick auf den Link sichtbar geschaltet.

Und diese Lösung konntest du per google nicht ausfindig machen? Kann bzw. will man ja schier nicht glauben.

Mit den Suchbegriffen "verstecken / anzeigen" dürftest du über die Suchfunktion genügend Lösungsansätze für dein Vorhaben finden.

mfg Maik
 
Wichtig ist vor allem auch, dass die URL des iFrames dann die in der Funktion angegebene ist (http://www.ebay.de). Es wird wahrscheinlich auf jeder Seite 3-4 Links geben mit jeweils unterschiedlichen URLs, sie sollen aber alle den selben iFrame ansprechen.

Was wäre in diesem Fall einfacher:

- einen schon bestehenden iFrame verändern mit Javascript
- oder beim Aufruf der Funktion einen kompletten iFrame kreieren?
 
Zuletzt bearbeitet:
Vielleicht hilft dir mein Beispiel weiter:
Javascript:
function show_iframe(url) {
  iframe = 'id_des_iframes';
  
  // Zeigt den iFrame an
  document.getElementById(iframe).style.display = 'block';
  // Laedt die angegebene URL
  document.getElementById(iframe).src = url;
}
 
Zuletzt bearbeitet von einem Moderator:
Nach viel Ausprobieren habe ich jetzt diese funktionierende Lösung:

Code:
	function preview (url){
    var frame = document.createElement('iframe');
    frame.src = url;
    frame.style.width = '300px';
    frame.style.height = '200px';
    document.getElementById("hierher").appendChild(frame);
}

Ein Problem bleibt aber noch. Über dem Frame soll noch ein h5-Tag mit der Beschriftung "Seitenvorschau" stehen. Kann ich das noch in die Variable frame mit einbringen?
 
da haben wir zur exakt selben Zeit gepostet ^^

Trotzdem danke aber ich habs ja jetzt gelöst, obwohl das Problem mit dem h5 Tag noch besteht (siehe vorheriger Post)
 
Zurück