Last active
June 28, 2016 18:41
-
-
Save irisli/e7989ac5d2765d84a170eb13f47fceaa to your computer and use it in GitHub Desktop.
Iframe height sync
This file contains 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
| <html> | |
| <head> | |
| <!-- MAKE SURE THERE IS 0 PADDING OUTSIDE OF resizeWrapper--> | |
| <style> | |
| body, html { | |
| padding: 0; | |
| margin: 0; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="resizeWrapper"> | |
| <!-- Content goes inside this div --> | |
| </div> | |
| </body> | |
| <script> | |
| ;(function() { | |
| var wrapper = document.getElementById('resizeWrapper'); | |
| window.postWindowSize = function() { | |
| parent.postMessage({ | |
| FRAMERESIZER: true, | |
| contentHeight: wrapper.offsetHeight, | |
| }, '*') | |
| }; | |
| setInterval(window.postWindowSize, 100); | |
| })(); | |
| </script> | |
| </html> |
This file contains 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="DESTINATION" id="childFrame"></iframe> | |
| <script> | |
| var childFrame = document.getElementById('childFrame'); | |
| window.addEventListener('message', function(event) { | |
| if (!event.data.FRAMERESIZER) { return; } | |
| document.getElementById('childFrame').style.height = (Math.floor(event.data.contentHeight) + 10) + 'px'; | |
| }, false); | |
| </script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment