displaying and collapsing divs

Discussion in 'JavaScript' started by scupbucket, Jul 30, 2007.

0
  1. #1
    I can find a ton of references on how to toggle divs between expanded and collapsed, but I can't find anything that fully suits what I need.

    perhaps you can help

    what I'm trying to do is have the content of my website all on one page, and the menu to simply expand or collapse the different sections rather than linking to other pages--the effect would be a very fast-loading website.

    so pretend there are 4 divs, given the id's "div1" ... "div4"
    then there is a menu, with links that say "show div1" ... "show div4"

    what I would like is for the links, when clicked, to expand the corresponding div (if it isn't already) and collapse any currently expanded divs.

    My knowledge of javascript is too limited to even know if this is possible, though it seems simple enough to me. The tricky part seems to be in seeing if there are any expanded divs, identifying which div(s) they are, and then collapsing them.

    Any help or advice would be very appreciated

    ~Lee
     
    scupbucket, Jul 30, 2007 IP
  2. scupbucket

    scupbucket Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    More information:

    The route I'm on right now involves setting classes
    -- .hidden {display:none;} .visible {display:block;} --

    and then putting them in each content div
    -- <div id="div1" class="visible">div1 content</div> <div id="div2" class="hidden">div2 content</div> --

    then I would have links that selected the corresponding div and expanded it, as well as collapsed any other currently expanded divs. So basically I think I need a function that switches the class of the clicked-div-link to "visible" while setting any other div with the class "visible" to "hidden"
    -- <a href="#" onClick="a bunch of mind boggling javascript;">show div2</a> --
     
    scupbucket, Jul 30, 2007 IP
  3. scupbucket

    scupbucket Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    wow, thanks Mike H., that works very well!

    Now the only thing is: is it possible to default to a certain div (i.e. home-page content div)?
     
    scupbucket, Jul 30, 2007 IP
  4. scupbucket

    scupbucket Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    sorry, I really should have mentioned it in my original post, and I was, in fact, editing my follow-up post to include it when you replied in such a prompt and timely manner as you did. It was an oversight on my part and I wasn't trying to manipulate you

    EDIT: oh, you deleted your posts. Note to anyone: I am not talking to myself
     
    scupbucket, Jul 30, 2007 IP