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 12 of 12

Thread: Partial opacity

  1. #1
    New Coder
    Join Date
    Jul 2002
    Location
    Sweden
    Posts
    66
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question Partial opacity

    How should I proceed if I want to create table with partial-transperent background and non-transperent text inside?



    ...and no two tables above eachother.....just one...

  • #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
    Use a semi-transparent PNG image as the background.

    Now, that would be the solution, but it only seems Konqueror, Gecko (NS), Opera, etc.. every browser except for IE can do it.

  • #3
    New Coder
    Join Date
    Jun 2002
    Location
    Colorado
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You can put this inside your tag:

    style="-moz-opacity:1.5; filter:alpha(opacity=90)"

    whereas "90" is the amount of transparency filtered out of the color.
    -Sk8er9547

  • #4
    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
    That makes the text partially opaque too.

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes,even if you did set it transparancy to 0 on the table row it would still remain transparant,so PNG is the only way.

  • #6
    Regular Coder
    Join Date
    Jul 2002
    Location
    New Zealand
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    How widely supported are PNG images? I have been wanting to use them quite often but was not sure which browsers it would actually work in.

    For similar effects i have used a GIF image and had every second pixel transparent to get a semi transprent dither effect, not as good as using a PNG but did the trick for a couple of sites.
    eTheory - the theory of revolution

  • #7
    New Coder
    Join Date
    Jul 2002
    Posts
    73
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote from jkd:
    but it only seems Konqueror, Gecko (NS), Opera, etc.. every browser except for IE can do it.
    Speaking of which, it seems that not only the image opacity style, but also a number of other attribs/objects (among them the annoying 'blink' attrib and the images object in JS) are NOT supported by MS IE. THIS can get annoying.

    Does anyone how it is possible to achieve the "moz-opacity" effect in IE (if possible)? For while I have nothing against Mozilla and the rest, it's really not nice to have "Teacher's Pets".

    Guardian23

  • #8
    Regular Coder
    Join Date
    Jun 2002
    Location
    Louisville, KY
    Posts
    279
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You could make every other pixel of the background image transparent, giving it a semi-transparent illusion.

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    -moz-opacity:1.0; in IE would be filter:alpha(opacity=100)

    Every graphical browser,except IE,supports PNG images good.

  • #10
    Regular Coder
    Join Date
    Jun 2002
    Location
    Beyond Lament
    Posts
    424
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by jkd
    That makes the text partially opaque too.
    http://www.angelfire.com/mo2/cbch21/...e.Opacity.html

    Would have to use 2 tables, one on top of the other...
    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!·

  • #11
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by Quiet Storm


    http://www.angelfire.com/mo2/cbch21/...e.Opacity.html

    Would have to use 2 tables, one on top of the other...
    That page doesn't work in Mozilla or any other browser than IE

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

    My entire site is for IE only browsers.

    That page is only an example - maybe someone can edit the code to support other browsers?


  •  

    Posting Permissions

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