Results 1 to 3 of 3

Thread: Is there a simple way of making DIV's opaque?

  1. #1
    Join Date
    Oct 2012
    Location
    England
    Posts
    103
    Thanks
    28
    Thanked 2 Times in 1 Post

    Default Is there a simple way of making DIV's opaque?

    Hi,

    Is there a simple way of making DIV's opaque?

    Thanks, Jay Dog

  2. #2
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Opaque = visible, "normal".
    Do you mean transparent, see-through?
    Opacity is a measure of visibility-- 100% is normal, visible, and 0% is fully transparent.

    https://www.google.com/search?q=css+div+opacity
    Of course css+div+transparency would come up with various results also.

    Let us know if you have a more specific question, but this is one that should be answerable with a simple search.
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  3. The Following User Says Thank You to djr33 For This Useful Post:

    Jay Dog (01-08-2014)

  4. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    All current version browsers use a division's css opacity property to set its opacity. However, users of Win XP who cannot avail themselves of the latest version of IE and who do not chose another browser like Chrome, Firefox, etc. are stuck with IE 8 which doesn't work with the opacity css property. So you can either exclude those folks from the opacity effects you want to use on your page or use a javascript library like jQuery which normalizes things like that, making IE 8 and less respond to the css property opacity if it's applied via one of jQuery's css methods.

    How to (assuming a div with an id of "myDiv", and setting opacity to half) -

    Using just css and not worrying about IE 8 and less:

    Code:
    #myDiv {opacity: 0.5;}
    The same thing, only applied dynamically via ordinary javascript:

    Code:
    documentGetElementById('myDiv').style.opacity = 0.5;
    Now, using jQuery (which does virtually all browsers):

    Code:
    $('#myDiv').css({opacity: 0.5});


    You can use IE 8 and less' proprietary filter alpha in a css declaration and/or javascript to cover those browsers (various conventions must be followed to make sure this doesn't interfere with normal browsers), but you asked for simple, and that's not simple.
    Last edited by jscheuer1; 01-09-2014 at 02:35 AM. Reason: add how to section
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. The Following User Says Thank You to jscheuer1 For This Useful Post:

    Jay Dog (01-08-2014)

Similar Threads

  1. Opaque Menu
    By ScottMcQ in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 05-17-2012, 05:35 PM
  2. Resolved Making a simple box
    By nootkan in forum CSS
    Replies: 1
    Last Post: 10-22-2009, 07:24 PM
  3. making a simple calculator
    By s.m. in forum Other
    Replies: 5
    Last Post: 09-11-2008, 03:59 PM
  4. text format in opaque
    By 93036web in forum CSS
    Replies: 2
    Last Post: 05-17-2007, 04:57 PM
  5. Top Navigational Bar v.3-Opaque Submenu
    By tdgboy in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 01-11-2006, 05:38 PM

Bookmarks

Posting Permissions

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