View Full Version : Transparent backgrounds in the inline frame...

01-21-2009, 05:49 AM
Hello, I've been working on this for a week now..
Basically, I 've created an inline frame using BlueVoda's tool, but I want the webpages that open into it to have a transparent background..
I've found a CSS 'code' that enables this, and I have placed it in the html properties of the pages and of the frame itself, but it appears that whatever html BlueVoda ceates for the page over-rides this..

Is there any way to get around that??

The code I found is,

<STYLE TYPE="text/css">
BODY {background-color: transparent ;}


Thanks in advance for the help :)

01-21-2009, 08:59 AM
Hi, pop the code...........
<style type="text/css">
body {background-color:transparent}
in the page HTML area under "Between the head" on the page you are calling for to appear in the iframe. If its something like this (http://metestsite.co.uk/tv%20with%20transparent.html), that your are trying to achieve.

01-21-2009, 05:36 PM
That's a similar code to what I was using, but it still doesn't work >_<
I have no idea what's going on with this thing..
If you head to my site, www.pawprintzkc.com (http://www.pawprintzkc.com/)
you'll see te 'Home' page (not the enter screen, lol) and the white box is my frame, I'd like that page to have a transparent background...
So it should have the blue behind it..
I even checked the 'source' for both my page and the one you gave, where the code should be matches perfectly...
Any other suggestions??
But thank you kindly for the help =)

01-21-2009, 05:57 PM
The page which will populate your i frame, surely you set the back ground exactly as you did with the page the i frame is sat on. It won't be transparent but when published it will give the illusion that it is.


01-21-2009, 06:04 PM
Yeah, that's what I've been doing.. But when I change the layout, I'm gonna need the background to be transparent..
'Cus it's gonna be layered over an image..

01-21-2009, 06:09 PM
Chris I couldn't get it to work either. It is not taking effect in the I-Frame. In your code it shows
<iframe name="" id="" style="position:absolute;left:337px;top:52px;width:288px; height:337px;z-index:1" src="http://www.metestsite.co.uk/tr1.html" frameborder="0" allowtransparency="true" background-color="transparent">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>
But this is what I (we) get
<iframe name="" id="InlineFrame1" style="position:absolute;left:134px;top:110px;width:413px ;height:302px;z-index:0" src="" frameborder="1">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>
The red portion is what is what we are missing, how did you get this?

01-21-2009, 06:13 PM
By the way your example isn't working now, it was yesturday but not now (at least when I view it in IE or FF)

01-21-2009, 06:26 PM
Am I being a bit dopey here lol? The job of an I frame is to display a web page. Now Scotty simply wants the background to be blue. to match one of his layers. All he has to do is change the page properties to the 'same blue'. When published I Frame background will be blue and give the impression its picking up the blue from the underlayer.


01-21-2009, 06:41 PM
Not quite, what he is looking for and not the way Chris's example worked yesturday. Scot want to have the I-Frame over an image so that the image (back ground) remains constant and visible when scrolling down the I-Frame. I understand what you are saying and have done that many times. This was a new concept to me too and actually pretty cool when it was working in Chris's example.

01-21-2009, 06:51 PM
Fair enough. I thought he wanted to match the blue layer but I guess we are talking about the blue background (with the paw prints). Is that right?


01-21-2009, 07:09 PM
Yes, exactly.. for the time being I have changed that page..
www.pawprintzkc.com/BLHome.html (http://www.pawprintzkc.com/BLHome.html)

The desired effect I'm trying for is that of my myspace page ( I hate to use it as an example (http://myspace.com/randomoniousness)-but it's where I got the idea from..)
It has one single background, and the text and tables float over it..

I got the background to stay put when scrolling, but I want the frame to be like a transparent table, only with a page in it.. if that makes sense, lol..
And for further posts, I'd like to be referred to as 'she', as I am very much female, lol.. (no worries, it happens =])

01-21-2009, 07:13 PM
O wow.. thank you D'son for pointing out the missing code.. I put that into the html of the frame itself, in the 'inside tag' properties and it worked =) YAY!!
Thank you all for your help!

01-21-2009, 07:54 PM
Sorry Scotty about the gender mix up. Glad that you got it to work, I am still not able to, but I will keep working on it.

01-21-2009, 09:58 PM
D'son, what I did was put the code
allowtransparency="true" background-color="transparent"
into the html properties of the frame under 'inside tag'..
but, you also have to put the code
<style type="text/css">
body {background-color:transparent}
into the html properties in the 'between the head' of the page (and each page) that opens into the frame..
Hope that helps ya =)