Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Jun 2002
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Dynamic HTML - Transparency question

    Hi,

    I wonder if it is possible to make a div/span item partially transparent (i.e. you see the item's own color plus the underlying site's).

    So far I've found the object.allowTransparency=true for full BG-transparency and the object.style.backgroundColor='red' to set the BG-Color. I couldn't really find something on MSDN but I don't really trust their search algorithm
    So: is it possible at all? If yes: how?

    Thanks guys!

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    For IE, you can use:

    filter: Alpha(opacity=0.5);
    OR
    filter: Opacity(alpha=0.5);

    (I can never remember which). That sets it to 50% opacity.

    CSS3 supplies a property called "opacity". When Gecko (NS6, NS7, Mozilla, etc), don't fully support a CSS property to specs, the append a -moz- in front of it. Because of Gecko's partial supoort for opacity, you can also use:

    -moz-opacity: 0.5;

    to achieve the same thing in NS6+.

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Beyond Lament
    Posts
    424
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Cool

    There are a few working examples on my site if you'd like to check them out.

    http://angelfire.com/mo2/cbch21/index2.html
    (IE only)
    Quíet Storm Designs ~ Art is not what you see, but what you make others see.
    · the Storms· || ·Ultraviolent Winter· || ·Was Einstein Wrong?· || ·It´s About Time!·

  • #4
    New Coder
    Join Date
    Jun 2002
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    @jkd: thanks, that helped a bit. But now only my table's contents are faded to the BG-Color of the table and not the whole table to the BG-Color of the underlying site. Some more details here on my part: I'm trying to make a dynamic table (with one picture and one sentence) sort of "shine-through". This is the code so far:

    <table border=2 width="60%" bordercolor="#00CC00" style="border-collapse: collapse; filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=10, Style=0)" cellpadding="0" cellspacing="0">

    @Quiet Storm: I tried to access your website but it didn't load (well, the first part did, the crome-thing window didn't)

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    Beyond Lament
    Posts
    424
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by FSME

    <table border=2 width="60%" bordercolor="#00CC00"
    style="border-collapse: collapse;
    filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=10,
    Style=0)" cellpadding="0" cellspacing="0">

    @Quiet Storm: I tried to access your website but it didn't load (well, the first part did, the crome-thing window didn't)
    What is all this business?:
    "filter:progid:DXImageTransform.Microsoft.Alpha"

    This is all you should need:
    Code:
    <table border=2 width="60%" bordercolor="#00CC00" 
    style="border-collapse: collapse; filter:Alpha(Opacity=10)" cellpadding="0" cellspacing="0">

    As for background opacity vs text, you'll need two tables positioned one on top of the other. One with the BG and opacity set at (10), the second table containing text with opacity set at (100).

    http://www.angelfire.com/mo2/cbch21/...e.Opacity.html
    Last edited by Quiet Storm; 06-29-2002 at 08:30 PM.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    Mumbai, India
    Posts
    218
    Thanks
    0
    Thanked 0 Times in 0 Posts
    "filter:progid:DXImageTransform.Microsoft.Alpha" : This is just a standard that Microsoft wants developers to use. It is a Microsoft CSS extension and is not required. You can simply use
    filter:Aplpha()
    Last edited by premshree; 06-30-2002 at 08:12 PM.

  • #7
    New Coder
    Join Date
    Jun 2002
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks everybody. I'm gonna try it next week-end (not home right now), so I'll let you know about my progress by then.

  • #8
    New Coder
    Join Date
    Jun 2002
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Allrighty, it's working now, thanks to the tips in Partial opacity. And yes, filter.Alpha(Opacity=50) is enough, you don't need that other stuff but it works with both...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •