Created
December 6, 2019 14:23
-
-
Save erivello/205a3b6104c4b3c87c88eaf411b2b99e to your computer and use it in GitHub Desktop.
Resize Cross Domain Iframe Height
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script type='text/javascript' src="js/jquery.min.js"></script> | |
<script type='text/javascript'> | |
// Size the parent iFrame | |
function iframeResize() { | |
var height = $('body').outerHeight(); // IMPORTANT: If body's height is set to 100% with CSS this will not work. | |
parent.postMessage("resize::"+height,"*"); | |
} | |
$(document).ready(function() { | |
// Resize iframe | |
setInterval(iframeResize, 1000); | |
}); | |
</script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<iframe src='iframe.html' id='edh-iframe'></iframe> | |
<script type='text/javascript'> | |
// Listen for messages sent from the iFrame | |
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent"; | |
var eventer = window[eventMethod]; | |
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message"; | |
eventer(messageEvent,function(e) { | |
// If the message is a resize frame request | |
if (e.data.indexOf('resize::') != -1) { | |
var height = e.data.replace('resize::', ''); | |
document.getElementById('edh-iframe').style.height = height+'px'; | |
} | |
} ,false); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment