linked toggle menus {requested by stacy n.}

Saturday, June 2, 2012

Okay, so some of you have probably noticed that in my previous design, a couple 'accordions' in my toggle menu were links. This is the HTML for that effect:

<a href="LINK URL"><div id="wrapper">
        <div class="accordionButton">BUTTON NUMBER ONE NAME</div>
        <div class="accordionContent"><p align="center"> </p></div> </a>

 Just replace the words in all caps with the link and the title of the page you want to link to. Make sure to keep the quotation marks {" "s}, like so:

<a href=""><div id="wrapper">
        <div class="accordionButton">About</div>
        <div class="accordionContent"><p align="center"> </p></div> </a>

This is tailored to the coding provided by Beauty Design Studios, but it might work with others. If there's text in the accordion you want to convert, just erase the text and proceed with the steps shown above. Happy coding!

glad to help,


  1. Thanks, for posting. ^.^
    And it works, but it seems to be shifting to the right. How do I fix it so it evens up with the other menus?
    If you want to see the html for it, it's here.
    Thanks in advanced.
    Stacy N.

  2. It ain't working for me. It would help if I could see an example of what exactly this does, just to know if I want it or not.

  3. Thanks for trying, I appreciate your help. I think I finally got it to not go to right, and that was not to include <*div id="wrapper"*> (no *'s)
    And it works fine without it.
    Have an amazing day. ^.^
    Stacy N.


comments make me smile. :)