# iframe Höhe automatisch



## rernanded (10. April 2017)

Hi

ich möchte das Inhalte von iframes was die Höhe betrifft immer automatisch angezeigt werden ohne vertikalen Scrollbalken. Dazu habe ich ein Script mit dem es funktioniert wenn die eingebundene Seite sich auf meinem Server im selben Ordner befindet - jedoch nicht mit fremden Seiten. Wobei ich gar keine fremden Seiten nutzen will, sondern lediglich meine Seiten aber auf einem anderen Server.


MONI


```
<head>
<script type="text/javascript">
  function iframeLoaded() {
      var iFrameID = document.getElementById('idiframe');
      if(iFrameID) {          
            iFrameID.height = "";
            iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";
      }  
  }
</script>

<style type="text/css">
.embed-container {
position: relative;
padding-bottom: 100%;
overflow: hidden;
width: 100%;
height: auto;
}
.embed-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>

</head>
</body>

<div class="embed-container">
<iframe frameborder="no" src="http://www.meine-seite-auf-anderem-server.de" id="idiframe" onload="iframeLoaded()" allowfullscreen></iframe>
</div>

</body>
```


----------



## Sempervivum (10. April 2017)

> mit dem es funktioniert wenn die eingebundene Seite sich auf meinem Server im selben Ordner befindet - jedoch nicht mit fremden Seiten.


Das liegt an der SOP: Die Browser blocken aus Sicherheitsgründen den Zugriff, wenn der Inhalt des iFrame auf einer anderen Domain liegt. Man kann auf dem Server des iFrame jedoch den Zugriff freigeben:
https://de.wikipedia.org/wiki/Cross-Origin_Resource_Sharing
Da dir Domain dir selber gehört, sollte das möglich sein. Wie man es einrichtet, weiß ich leider nicht.


----------



## SpiceLab (10. April 2017)

Sempervivum hat gesagt.:


> Da dir Domain dir selber gehört, sollte das möglich sein. Wie man es einrichtet, weiß ich leider nicht.



https://enable-cors.org/server.html
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Access-Control-Allow-Origin
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin


----------

