"Transparent" div not possible in IE - "background-attachment: fixed" not properly rendered

Discussion in 'HTML' started by GuyBrush Treepwood, Mar 29, 2005.

  1. I got this link in this newsgroup to show me how a div can be "transparent".
    But as stated on the site, IE doesn't render this properly because it
    doesn't follow the standard.
    I personally don't care for Microsoft or IE,
    but making a website that the most people can't see as it is supposed to
    be seen, is not very user-friendly.
    Is there a workaround to have the same effect in IE?

    --
    "Don't worry about people stealing your ideas. If your ideas are any good,
    you'll have to ram them down people's throats."
    -- Howard Aiken
    GuyBrush Treepwood, Mar 29, 2005
    #1
    1. Advertising

  2. On Tue, 29 Mar 2005 05:44:49 +0200, GuyBrush Treepwood wrote:

    > I got this link in this newsgroup to show me how a div can be "transparent".
    > But as stated on the site, IE doesn't render this properly because it
    > doesn't follow the standard.
    > I personally don't care for Microsoft or IE,
    > but making a website that the most people can't see as it is supposed to
    > be seen, is not very user-friendly.
    > Is there a workaround to have the same effect in IE?


    Sorry, here's the link:
    http://www.meyerweb.com/eric/css/edge/complexspiral/demo.html

    --
    "Don't worry about people stealing your ideas. If your ideas are any good,
    you'll have to ram them down people's throats."
    -- Howard Aiken
    GuyBrush Treepwood, Mar 29, 2005
    #2
    1. Advertising

  3. GuyBrush Treepwood

    Mark Parnell Guest

    Previously in alt.html, GuyBrush Treepwood <> said:

    > I got this link in this newsgroup to show me how a div can be "transparent".

    <snip>
    > Is there a workaround to have the same effect in IE?


    I assume from the subject line that you are talking about the
    background-attachment: fixed; property, though you didn't mention it in
    your actual message.

    Anyway, it's amazing what a little googling will turn up:

    http://www.howtocreate.co.uk/fixedBackground.html
    http://www.pageresource.com/html/fixedbg.htm

    Neither are ideal solutions, but they're probably about the best you're
    going to get until IE7 (if you're lucky).

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    Mark Parnell, Mar 29, 2005
    #3
  4. GuyBrush Treepwood

    mscir Guest

    Re: "Transparent" div not possible in IE - "background-attachment:fixed" not properly rendered

    GuyBrush Treepwood wrote:

    > On Tue, 29 Mar 2005 05:44:49 +0200, GuyBrush Treepwood wrote:
    >
    > >I got this link in this newsgroup to show me how a div can be

    > "transparent".
    > >But as stated on the site, IE doesn't render this properly because it
    > >doesn't follow the standard.
    > >I personally don't care for Microsoft or IE,
    > >but making a website that the most people can't see as it is supposed to
    > >be seen, is not very user-friendly.
    > >Is there a workaround to have the same effect in IE?

    >

    This works in my IE 6, Netscape 7.2, Firefox 1.0.1

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html>

    <head>
    <title>Opacity</title>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
    <style type="text/css">
    body{
    width: 100%;
    height: 100%;
    color: #000000;
    background-color: #FFFFFF;
    }
    #menu{
    margin: 5px;
    display: block;
    width: 160px;
    top: 180px;
    left: 9px;
    opacity: .1; /* these 2 lines control opacity: they work
    in IE, NN, Firefox */
    filter: alpha(opacity=10); /* make sure the numbers agree, e.g. .7
    corresponds to 70% */
    color: #000000;
    background-color: #FFFFFF;
    border: 1px solid black;
    padding: 10px;
    }
    </style>
    </head>

    <body>
    <div id='menu'>
    This is the Opaque Div
    </div>
    </body>
    </html>
    mscir, Mar 29, 2005
    #4
  5. GuyBrush Treepwood

    Toby Inkster Guest

    mscir wrote:

    > opacity: .1; /* these 2 lines control opacity: they work
    > in IE, NN, Firefox */


    Well, that one works in recent versions of Gecko, but it's part of CSS 3,
    so not widely implemented yet.

    > filter: alpha(opacity=10); /* make sure the numbers agree, e.g. .7
    > corresponds to 70% */


    And this one is a proprietry CSS extension from MS.

    If you're just looking for a translucent *background*, then try:
    http://examples.tobyinkster.co.uk/translucency/

    If you're after a translucent background *and* *foreground*, then try
    mscir's suggestion, but also look into the "-khtml-opacity" property for
    Konqueror and Safari support.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me ~ http://tobyinkster.co.uk/contact
    Toby Inkster, Mar 29, 2005
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. K Viltersten

    <div ... /> and <div ...></div>

    K Viltersten, Mar 30, 2009, in forum: ASP .Net
    Replies:
    4
    Views:
    725
  2. Timo

    Panel rendered variously as DIV and TABLE

    Timo, Apr 8, 2004, in forum: ASP .Net Web Controls
    Replies:
    3
    Views:
    356
    Teemu Keiski
    Apr 10, 2004
  3. Dwayne Madsen

    Q: Div A inside Div B is larger than Div B

    Dwayne Madsen, Jun 1, 2005, in forum: Javascript
    Replies:
    1
    Views:
    177
    David Dorward
    Jun 1, 2005
  4. mscir
    Replies:
    3
    Views:
    296
    Martin Honnen
    Jun 26, 2005
  5. Terry
    Replies:
    2
    Views:
    64
    Thomas 'PointedEars' Lahn
    Nov 17, 2007
Loading...

Share This Page