Results 1 to 2 of 2

Thread: Keeping a submenu open after page reload

  1. #1
    Brklynartist10 Guest

    Keeping a submenu open after page reload

    Hi. I'm hoping someone can help me find a way, using javascript instead of having to go to PHP, to keep a submenu open after a submenu link has been click and opens a new page.

    Here's my page: http://andybrownmedia.com/Scratch/browse.html
    Right now I only have content for the first two submenu items, so they are the only ones coded. The HTML code for the list is this:

    <a class="menu1" onclick="showHide('mymenu1')">ACHILLES</a>
    <div id="mymenu1" class="hide">
    <a href="achilles_tendonitis.html" target="_top" class="submenu">Achilles Tendonitus</a>
    <a href="peroneal_tendon.html" target="_top" class="submenu">Peroneal Tendon</a>
    <a href="#" class="submenu">Xanthomas of the Achilles Tendon</a>
    </div>
    <a class="menu1" onclick="showHide('mymenu2')">ANKLE</a>

    <div id="mymenu2" class="hide">
    <a href="#" class="submenu">Ankle Sprain</a>
    <a href="#" class="submenu">Osteochondritis</a>
    <a href="#" class="submenu">Chronic Lateral Ankle Sprain</a>
    </div>
    etc...


    And here's my Javascript for it.

    menu_status = new Array();

    function showHide(theid){
    if (document.getElementById) {
    var switch_id = document.getElementById(theid);

    if(menu_status[theid] != 'show') {
    switch_id.className = 'show';
    menu_status[theid] = 'show';
    }else{
    switch_id.className = 'hide';
    menu_status[theid] = 'hide';
    }
    }
    }

    var last_expanded = '';

    function showHide(id)
    {
    var obj = document.getElementById(id);

    var status = obj.className;

    if (status == 'hide') {

    if (last_expanded != '') {
    var last_obj = document.getElementById(last_expanded);
    last_obj.className = 'hide';
    }

    obj.className = 'show';

    last_expanded = id;
    } else {
    obj.className = 'hide';
    }
    }


    So what happens now is if I click the category ACHILLES then Achilles Tendon, the Achilles Tendon page loads and the menu returns to its default (collapsed). Is there a bit more code I can add to not have it return to default?

    Thanks for your help!

  2. #2
    Join Date
    Mar 2010
    Location
    Ithaca, NY, USA
    Posts
    212
    There are two ways you can do this:

    1. Load your content into an <iframe>.

    2. Use JavaScript/AJAX or JQuery to change the content area.

Similar Threads

  1. Using iframes... framed page is loading?
    By Musikpro in forum Web Design, HTML Reference and CSS
    Replies: 0
    Last Post: 17 Nov 2008, 12:57 PM

Posting Permissions

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