Cross-domain-iframe-resizer mit postMessage

Es ist ein tolles Skript von thomax - es funktioniert auch, so können Sie verwenden iframes auf mobile - iphones und android -

Für IE7 und IE8 verwenden Sie die Fenster.attachEvent statt Fenster.addEventListener
Es sollte auch onmessage statt der Nachricht (siehe unten) ps: Sie müssen auch das gleiche zu tun auf dem server mit dem content-Buchung Ihrer Größe

<script type="text/javascript">
if (window.addEventListener)
{
  function resizeCrossDomainIframe(id) {
    var iframe = document.getElementById(id);
    window.addEventListener('message', function(event) {
      var height = parseInt(event.data) + 32; 
      iframe.height = height + "px";
    }, false);
  }
}
else if (window.attachEvent)
{
  function resizeCrossDomainIframe(id) {
    var iframe = document.getElementById(id);
    window.attachEvent('onmessage', function(event) {
      var height = parseInt(event.data) + 32; 
      iframe.height = height + "px";
    }, false);
  }
}
</script>

InformationsquelleAutor Peter

Mit Peter ' s code und ein paar Ideen aus hier, Sie zu trennen, sich die Kompatibilität aus den ausführbaren code, und fügen Sie einige cross-site-Validierung.

<script type="text/javascript">
  //Create browser compatible event handler.
  var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
  var eventer = window[eventMethod];
  var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

  //Listen for a message from the iframe.
  eventer(messageEvent, function(e) {
    if (e.origin !== 'http://yourdomain.com' || isNaN(e.data)) return;
    document.getElementById('iframe_id_goes_here').style.height = e.data + 'px';
  }, false);
</script>

Auch, der Vollständigkeit halber, könnten Sie den folgenden code innerhalb des iframe, Wann immer Sie wollen zum auslösen der Größe ändern.

parent.postMessage(document.body.offsetHeight, '*');

InformationsquelleAutor deadbeef404