Ändern des iframe wenn eingebundene Seite ( Fremdserver ) refreshed

Hallo wie kann ich am besten Einfluss auf die css/den style eines iframe nehmen, wenn sich die eingebundene Seite automatisch refreshed? Alles liegt auf einem Server. Zum Beispiel sollen sich die Werte für top: und left: ändern sobald der refresh erfolgt.

Der hier verwendete Code

<!doctyoe html> <html lang="de"> <head> <style> *{ margin:0; padding:0; } body{ display: flex; flex-direction: column; align-items: center; } iframe{ width:80%; height:300px; border:2px solid black; } p{ width:80%; } main{ width:80%; height:40px; border:2px solid black; overflow:hidden; } h5{ margin:30px 0 0px 0; } div{ width:80%; height:200px; border:2px solid black; overflow:hidden; } button{ width:300px; } </style> </head> <body> <h5>Was schreibt der Iframe</h5> <main></main> <h5>Was sendet der iframe an der function ? </h5> <div></div> <h5>Iframe was da angezeigt wird</h5> <iframe id="lol" src="https://basti1012.de/iframe/iframe_fremdserver.php"></iframe> <p> <span>Text zum Stoppen mitgeben</span> <input type="text" value="Ich habe keine lust mehr" id="text"> <button id="abbruch">Counter ,reload im Iframe stoppen</h5></p> <p> <button id="neustart">Counter neu Starten</h5> </p> <script> window.onload = function () { man=document.getElementsByTagName('main')[0]; man.innerHTML='Warte auf Nachricht vom Iframe<br>'; div=document.getElementsByTagName('div')[0]; div.innerHTML='Warte auf Nachricht von der function<br>'; ifra=document.getElementById('lol'); window.addEventListener("message",function(event){ data=JSON.parse(event.data); //console.log(data); if ( event.origin !== "https://basti1012.de" ){ return //website isn't ours bro }else{ if(data[0]=='sms'){ man.innerHTML=data[1]; } if(data[0]=='func'){ eval(data[1]); } if(data[0]=='border'){ ifra.style.border=data[1]; } } }) function test(inhalt){ div.innerHTML+=inhalt; div.scrollTop = div.scrollHeight - div.clientHeight; } var receiver = document.getElementById('lol').contentWindow; document.getElementById('abbruch').addEventListener('click',function(){ var text=document.getElementById('text'); arr=['stop',"stop()",text.value]; var data = JSON.stringify(arr); receiver.postMessage(data, 'https://basti1012.de'); }) document.getElementById('neustart').addEventListener('click',function(){ text='So , weiter gehts'; arr1=['start',"start()",text]; var data1 = JSON.stringify(arr1); receiver.postMessage(data1, 'https://basti1012.de'); }) /* window.setTimeout(function(e){ var receiver = document.getElementById('lol').contentWindow; receiver.postMessage('nachricht von basti1012', 'https://basti1012.de'); //console.log(receiver); },3000); */ } </script> </body> </html>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!