Tuesday, September 18, 2018

How do I create an Iframe and insert it into my webpage with only JavaScript?

There are times when you will want to create and insert an Iframe page onto the current page the user is on.

This gives you a number of advantages, like allowing you to load a whole new webpage or website in the iframe (though some sites disallow others to use them through iframes, such as Google).

In JavaScript, the code to create the iframe is this simple..

var iframe = document.createElement('iframe');
iframe.src= "http://www.earthfluent.com";

You'll notice that, it won't be a very useful iframe unless you define some basics, like width and height...

iframe.width = "200";
iframe.height = "200";

Then you append it to your document with JavaScript...

document.getElementById("PlaceIframeHere").appendChild(frame);

Or with jQuery...

$("#PlaceIframeHere").append(frame);

No comments:

Post a Comment