Results 1 to 2 of 2

Thread: Making JS Accordion play nice with opacity

  1. #1
    dzandman Guest

    Making JS Accordion play nice with opacity

    Hello world! I am basically a webdev beginner.

    I was trying last night to update/revamp my site (dzandman.com), but I hit a bump. I'm trying to figure out how to make the text on each main label (About Me, My Work...) stay 100% opacity, while the bg color is reduced.

    This guy (http://www.daniweb.com/forums/thread297491.html) got me close, but I can't figure out how to implement his CSS without breaking the JS. Any ideas?

    As an example, this is how the second drawer is set up:

    <h1 class="accordion_toggle">My Work</h1>
    <div class="accordion_content">

    <div id="vertical_nested_container" >

    <h3 class="vertical_accordion_toggle">Advertising</h3>
    <div class="vertical_accordion_content">
    Thank you very much!

  2. #2
    Join Date
    Feb 2006
    Location
    Salisbury UK
    Posts
    4,332
    Opacity or filter applies to all content in the same element, so the only way you can get text or an image with no opacity over a background that has opacity is to layer it, using a div or another element that isn't nested and it needs position: absolute or position: relative to reposition it over the element with opacity.

    I've never tried that with an accordion menu.
    Code downloaded to my PC will be deleted in due course.
    WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
    Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.

Similar Threads

  1. Accordion Menu
    By jschnyderite in forum Web Design, HTML Reference and CSS
    Replies: 1
    Last Post: 24 Feb 2010, 04:00 PM
  2. accordion menu !!!
    By nits4u in forum Client & Server Side Scripting (PHP, ASP, JavaScript)
    Replies: 1
    Last Post: 27 Dec 2009, 11:25 PM
  3. accordion script
    By widget in forum Tutorials
    Replies: 0
    Last Post: 02 Apr 2009, 10:46 PM
  4. Spry Accordion
    By breakoutfoo in forum Web Design, HTML Reference and CSS
    Replies: 0
    Last Post: 15 Feb 2009, 12:17 PM

Tags for this Thread

Posting Permissions

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