Transparent Iframes

Transparent Iframes can be really essential when coding your site, I know it is for me. Just about all of my sites use them! I've had some requests to write this tutorial, so I thought it was about time I make one. Transparent iframes makes your iframes and scrollbars trasnsparent so that the image behind it shows. Just read on:

Add this to your iframe code: allowtransparency="true". The full code should look like this now:
<iframe FRAMEBORDER="0" BORDER=0 width=# height=# src="URL OF PAGE" name=IFRAME NAME style="position:absolute; left:#; top:#" scrolling=YES OR NO allowtransparency="true"></iframe>

Once that is done, put this in your background CSS:
<!-- BODY {background-color: 000000; filter: alpha(opacity=70)} -->

The background color and opacity level can be changed to however you want.

TRANSPARENT IFRAMES W/O LIGHTENING

To have transparent iframs w/o everything lightening up or having a "faded" look, use this code, which will just give you the background, and leave everything else the same:
<iframe FRAMEBORDER="0" BORDER=0 width=# height=# src="URL OF PAGE" name=IFRAME NAME allowTransparency scrolling=YES OR NO style="position:absolute; top:#px; left:#px"></iframe>

Put this into your background CSS:

<!-- BODY {background:none transparent;color:000000}-->

[ Back ]