Beispiel:Iframe-5.html
Aus SELFHTML-Wiki
<!DOCTYPE html> <html lang="de"> <head>
<meta charset="UTF-8" >
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
<title>Demo mit aktivem Inhalt</title>
<style>
iframe {
width: 100%;
border: 2px solid gold;
transition: height 0.3s ease;
}
</style>
</head> <body>
Demo mit aktivem Inhalt
<iframe id="myFrame" src="https://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:Iframe-child-2.html"></iframe>
<script> document.addEventListener('DOMContentLoaded', () => {
const iframe = document.getElementById('myFrame');
window.addEventListener('message', (event) => {
if (event.origin !== "https://wiki.selfhtml.org") return;
const data = event.data;
if (data?.type === 'resize' && typeof data.height === 'number') {
iframe.style.height = (data.height) + 'px';
}
});
}); </script> </body> </html>
