Note: While this solution may have worked in some browsers when it was written in 2014, it no longer works. Navigating or redirecting to an HTTP URL in an iframe embedded in an HTTPS page is not permitted by modern browsers, even if the frame started out with an HTTPS URL. The best solution I … Read more
I present to you The Incredible Singing Cat solution =) .wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } jsFiddle: http://jsfiddle.net/omarjuvera/8zkunqxy/2/ As you move the window bar, you’ll see iframe to responsively resize Alternatively, you may … Read more
You can do this with a data URL. This includes the entire document in a single string of HTML. For example, the following HTML: <html><body>foo</body></html> can be encoded as this: data:text/html;charset=utf-8,%3Chtml%3E%3Cbody%3Efoo%3C/body%3E%3C/html%3E and then set as the src attribute of the iframe. Example. Edit: The other alternative is to do this with Javascript. This is almost … Read more
Add scrolling=”no” attribute to the iframe.
The exact question is how to do it with pure JavaScript not with jQuery. But I always use the solution that can be found in jQuery’s source code. It’s just one line of native JavaScript. For me it’s the best, easy readable and even afaik the shortest way to get the iframes content. First get … Read more
Allthough your src = encodeURI should work, I would have gone a different way: var iframe = document.createElement(‘iframe’); var html=”<body>Foo</body>”; document.body.appendChild(iframe); iframe.contentWindow.document.open(); iframe.contentWindow.document.write(html); iframe.contentWindow.document.close(); As this has no x-domain restraints and is completely done via the iframe handle, you may access and manipulate the contents of the frame later on. All you need to make … Read more
<iframe> elements have a load event for that. How you listen to that event is up to you, but generally the best way is to: 1) create your iframe programatically It makes sure your load listener is always called by attaching it before the iframe starts loading. <script> var iframe = document.createElement(‘iframe’); iframe.onload = function() … Read more
I answered a similar question (see Javascript callback when IFRAME is finished loading?). You can obtain control over the iframe load event with the following code: function callIframe(url, callback) { $(document.body).append(‘<IFRAME id=”myId” …>’); $(‘iframe#myId’).attr(‘src’, url); $(‘iframe#myId’).load(function() { callback(this); }); } In dealing with iframes I found good enough to use load event instead of document … Read more
Also you can set name and ID to equal values <iframe id=”frame1″ name=”frame1″ src=”https://stackoverflow.com/questions/935127/any.html”></iframe> so you will be able to use next code inside child page parent.document.getElementById(window.name);
Your resource probably use a self-signed SSL certificate over HTTPS protocol. Chromium, so Google Chrome block by default this kind of resource considered unsecure. You can bypass this this way : Assuming your frame’s URL is https://www.domain.com, open a new tab in chrome and go to https://www.domain.com. Chrome will ask you to accept the SSL … Read more