View Full Version : transparent iframe scrollbar and background


katherine
04-27-2004, 11:41 AM
Hi! Please help!

I want to have a transparent scrollbar for my iframe so that the background can also be seen - to make that iframe's white space transparent instead - and I'm using this code:

<iframe name="frame1" style="FILTER: chroma(color=#ff0000)" allowtransparency="true"
"position:absolute; top:150px; left:60px;
width:280px; height:255px" frameborder="0" src="blog.html">

Which doesn't work. Please help! Thanks!

Chris
04-27-2004, 04:42 PM
<IFRAME name="frame1" src="blog.html" width=280 height=255 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=auto style="FILTER: chroma(color=#ffffff)" allowtransparency="true"></IFRAME>

ok, i think that may be the same code, just in a different order but you could try it - i mean, it can't jurt anyone, can it? lol

Chris

bourdelson
04-27-2004, 09:08 PM
<iframe name="frame1" style="position:absolute; top:150px; left:60px;
width:280px; height:255px; FILTER: chroma(color=#ff0000);" allowtransparency="true" frameborder="0" src="blog.html"></iframe>

I put your absolute positioning inside of the style="" and you forgot the closing iframe tag and some ;'s. :)

Did you put background-color:transparent; on each page that opens inside of your iframe, and is the color #ff0000 in your scrollbar code?

Maybe posting a link to your page will help. :)

katherine
04-28-2004, 11:42 AM
Ahh, thanks for replying! But I tried all of that and it still doesn't work *makes face*

But here's the URL:

http://arisen-ashes.net/tealeaves/save.html

*sighs, frustrated* I honestly don't know what's wrong. Any ideas? Thanks! :)

Rosey
04-28-2004, 01:37 PM
You need to set the scrollbar colors first, you need to set it to red and then the transparency will work.

Add this to your css of your frame url (ABC.html)

body
{scrollbar-face-color : #ff0000;
scrollbar-highlight-color : #000000;
scrollbar-3dlight-color : #ff0000;
scrollbar-shadow-color : #000000;
scrollbar-darkshadow-color : #ff0000;
scrollbar-track-color : #ff0000;
scrollbar-arrow-color : #ff0000; }

katherine
04-29-2004, 10:53 AM
I've just done that as well, but it still isn't working :( Thanks for the suggestion though...

Is there another way to do this? Please help! I'm desperate to get this fixed soon.

Rosey
04-29-2004, 11:01 AM
Your coding is wrong on your abc.html, it should be this:


<html>
<head><title></title>
<link href="love.css" rel="stylesheet" type="text/css">

<style type="text/css">

BODY {scrollbar-face-color : #ff0000;
scrollbar-highlight-color : #000000;
scrollbar-3dlight-color : #ff0000;
scrollbar-shadow-color : #000000;
scrollbar-darkshadow-color : #ff0000;
scrollbar-track-color : #ff0000;
scrollbar-arrow-color : #ff0000; }

</style>


<body TOPMARGIN=0 LEFTMARGIN=0 MARGINHEIGHT=0 MARGINWIDTH=0>

<font face="Courier New" style="font-size:8pt">
<div align="justify">

GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER
<br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER
<br><br>

GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER
<br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER
<br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER
<br><br>
GIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGIBBERGI BBERGIBBERGIBBERGIBBER <br><br>



</body>
</html>

katherine
04-30-2004, 09:58 AM
AHH! Thank you! It worked! I think I almost cried. But is there a way to make the iframe - white space - transparent as well?

http://arisen-ashes.net/tealeaves/save.html

That's my last problem, I think. Hopefully. Thanks for helping me make the scrollbar transparent anyhow!

MaGiCSuN
04-30-2004, 04:00 PM
Did you put background-color:transparent; on each page that opens inside of your iframe, and is the color #ff0000 in your scrollbar code?

Maybe posting a link to your page will help. :)

background-color: transparent; is only for making the background transparent :) has nothing to do with the scrollbar :)

Love,
Mirna

katherine
05-02-2004, 07:32 AM
Wait - is there any way to make the background come through behind the text and stuff, but remain only in the iframe?

MaGiCSuN
05-02-2004, 03:07 PM
add style="filter: alpha(opacity=50);" to the <iframe> tag will probably make it translucent, but will make EVERYTHING translucent including the text.

The best way is to cut out the background piece and edit it in a graphic editor to your own needs :)

love,
Mirna