Create an iframe with these simple tools and references.
Everything you need to build your own iframes
iFrame samples are the easiest way to learn how to create interesting effects and deliver page content using iframes. Here are some of our favorites.
iFrame Browser Effect
Creating a mini-browser using an iframe
We have created a simple browser type of control set for an iframe, as this has been frequently searched on the web. Above, you have the basic functionality of an iFrame based browser. View this browser on its own page by clicking here.
While this is all very cool, some might ask themselves... "What good is an iframe browser?" Hmmmm... well, suppose you share your computer with someone - perhaps an unpleasant room-mate, perhaps a mother-in-law, maybe a soon-to-be ex-spouse... all of these folks are known to check the browsing history of others.
You know where I'm going with this...
So open your browsing history. Keep it open while you do a little test... now use the mini browser above and search a few sites. Did you notice something? They do not show up in your browser's history. That's pretty cool, huh?
So if you want to browse without a history, all you need do is make a full screen version... you can include some of the security measures we outline on our security page to prevent break-out scripts, and voila...
We just know you will use this little trick for the betterment of mankind.
iframe Generator Demo
Using iframes to dynamically display script output on-page
You can use an iframe to instantly display the results of a PHP or other script. This is a short demo of a button creation script with the created button appearing in an iframe window.
Simple Button Generator:
Use this tool to generate your own buttons the easy way. You can customize the behaviors and colors, or simply use it to learn how to code buttons for yourself.
Scrolling inside the iframe
Setting an iframe to open a page in the middle and/or scrolling that page
Opening Links in One iframe From Another iframe
You can open links in one iframe from inside another. There are two ways of doing this... one is to have the frame of choice listed as the target, the other way is to use the base tag as shown below.
Making ALL links in an iframe open in a new page or another iframe
You can make ALL of the links inside one frame open in the other frame or in a new window/tab by using the base tag as shown below. You can set the target to "_blank" to open a new page for all links inside the iframe, or alternatively, to another iframe on the page.
Iframe with framebordersCode:
page-1 | page-2 <--You can navigate by clicking on these links.
Iframe without framebordersCode:
page-1 | page-2
>>>Close this section...
What is better: Scrollto or using an anchor tag?
The scrollto command scrolls to different places in FF and IE, so it is usually better to use an anchor tag and point the link to it as we did in the scroller above.
Can I force my internal iframe to only open in the parent page?
Yes you can. See full instructions and two methods on our script page.
How can I quickly view the contents of someone else's iframe?
Right click on the internal frame and select properties. Firefox will let you open the internal frame in its own window.
Why don't some pages load in my iframe - and others jump out of it?
Some sites are jealous of their content and do not want it being held captive by other sites. There are scripts to make a page jump out of iframes. There is also a script to keep a page from loading in an iframe.
The popularity of Digg, and the fact that they display content pages in their own iframe designed to look like a toolbar has probably prompted much work in this area.
Could you defeat this?
Yes, you could use PHP to rewrite the header without the offending script - but if someone does not want you using their content this way, it is best to leave their intellectual property as it is and create your own content.
See our scripts page for details about how to defeat this as well as how to keep your pages from being locked into iframes.
iFrame or PHPinclude?
Like everything else in web development, there is a lot of flexibility and the developer must decide how to present the content to the end user.
iFrames are most famously used by Digg and Google - but many sites use them to present dynamic content.
iFramed content - if it is your own does not help your SEO - so if squeezing the last bit of potential for pure SEO purposes is your main goal, you might want to look at server side includes.
The best decision is an informed one, so look into both solutions before settling upon one. Neither one is the right choice for absolutely every situation.
Beginners can have fun with iFrames and their results will look almost like AJAX. For example, here is a simple trick to hide the answer of a joke or question using an iframe. The iframe is displayed without a frameborder and using the same background color as this page. When the answer button is clicked, it loads in the invisible iframe. Try it!
Q: What's Black and Brown and would look good on a lawyer?