Paul Masson Paul Masson - 3 months ago 10x
HTML Question

Three.js embedded in iframe grows endlessly in iOS 8/9

If a file containing Three.js is embedded in a web page using an iframe

<iframe id=viewer src=document-with-threejs.html></iframe>

then the iframe grows endlessly in size when the page is viewed in Mobile Safari. This behavior has not been corrected in iOS 9 released today. This question and answer are posted to make the information easily accessible to web searches.


The fix for this behavior is found in New and improved version as of 3 July 2016:

var viewer = document.getElementById( 'viewer' );

// iOS iframe auto-resize workaround

if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) { = getComputedStyle( viewer ).width; = getComputedStyle( viewer ).height;
    viewer.setAttribute( 'scrolling', 'no' );