In diesem kurzen Tutorial erkläre ich euch, wie ihr erkennen lassen könnt mit Javascript, ob eure Webseite mit in einem Iframe geöffnet wurde.
function isiFrame () {
try {
return window.self !== window.top;
} catch (e) {
return true;
}
}
window.top ist das höchste Fenster was es gibt. Es gibt keine Fenster, welche höher sind. Dann haben wir noch die window.self Eigenschaft - diese gibt das Fenster selbst aus.
Wenn nun das höchste Fenster nicht dem Fenster selbst entspricht, ist das aktuelle Fenster in einem iFrame geöffnet. Ist das höchste Fenster gleich dem Fenster selbst ist es kein iFrame.
Hier habe ich euch einmal ein Beispiel erstellt, an dem ihr die Funktionalität noch einmal sehen könnt. Ihr könnt den unten stehenden Link öffnen, dann könnt ihr entsprechend die andere Meldung Rot hinterlegt sehen.
<div id="notOpenInFrame">
<p>Seite ist nicht in einem iFrame Geöffnet</p>
</div>
<div id="openInframe">
<p>Seite ist in einem iFrame Geöffnet</p>
</div>
function isiFrame() {
try {
return window.self !== window.top;
} catch (e) {
return true;
}
}
if(isiFrame()){
document.getElementById('openInframe').style.background = '#eb4034';
document.getElementById('openInframe').style.color = '#fff';
}else{
document.getElementById('notOpenInFrame').style.background = '#eb4034';
document.getElementById('notOpenInFrame').style.color = '#fff';
}
Hinterlasse mir gerne einen Kommentar zum Artikel und wie er dir weitergeholfen hat beziehungsweise, was dir helfen würde das Thema besser zu verstehen. Oder hast du einen Fehler entdeckt, den ich korrigieren sollte? Schreibe mir auch dazu gerne ein Feedback!
Es sind noch keine Kommentare vorhanden? Sei der/die Erste und verfasse einen Kommentar zum Artikel "Javascript iFrames Erkennen "!