Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question CSS collapsing nav menu - need active state help - please

    I have been trying to figure this out for days now and need some help. I am trying to make the submenus on my collapsible nav to stay open when the user is taken to the linked page..any ideas? Here is the code:

    <style type="text/css" media="screen">
    <!--
    body {
    margin: 0;
    padding: 0;
    background color: #d1daec;
    font-family: helvetica;
    font-size: 0.6em;
    font-weight: bold;
    }
    #dl, dt, dd, ul, li {
    margin: 0;
    padding: 0;
    list-style-type: none;
    white-space: normal;
    }
    #menu {
    position: static; /* Menu position that can be changed at will */
    top: 105;
    left: 2;
    }
    #menu {
    width: 12em;
    }
    #menu dt {
    cursor: pointer;
    margin: 0;

    line-height: 15px;
    text-align: left;
    font-weight: bold;
    border: #d1daec;
    background: #d1daec;
    }
    #menu dd {
    border: #d1daec;
    }
    #menu li {
    text-align: left;
    background: #ffffff;
    }
    #menu li a, #menu dt a {
    color: #d1daec;
    text-decoration: none;
    display: block;
    border: 0 none;
    height: 100%;
    }
    #menu dt a:hover {
    background: #ffffff;
    }
    #menu li a:hover {
    background: #d1daec;
    }
    -->
    </style>
    <script type="text/javascript">
    <!--
    window.onload=show;
    function show(id) {
    var d = document.getElementById(id);
    for (var i = 1; i<=20; i++) {
    if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
    }
    if (d) {d.style.display='block';}
    }
    //-->
    </script>
    <dl id="menu">
    <dt onclick="javascript:show();"><a href="http://www.supportplus.com/Medical_Support_Hose.cfm?catx=&title=Medical%20Support%20Hose"><font size="small" color="#3c4d5f">&nbsp;<b>Medical Support Hose</b></font></a></dt>
    <dt onclick="javascript:show('smenu2');"><a href="http://www.supportplus.com/womens_hose.cfm?gender=Women&catx=wsh&title=Women's%20Medical%20Support%20Hose"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Women's</b></font></a></dt>
    <dd id="smenu2" style='display:none'>
    <ul>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=jobst&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Jobst%20A ND%20Womens&&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Jobst</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=futuro&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Futuro%2 0AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Futuro</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=bauer%20black&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=B auer%20Black%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Bauer & Black</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=support%20plus&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE= Support%20Plus%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Support Plus</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Compression</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=mild&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Mild%20AND %20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Mild (8-15)</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=moderate&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Modera te%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Moderate (15-20)</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Firm%20AND %20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Firm (20-30)</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=very%20firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Ver y%20Firm%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Very Firm (30+)</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=knee%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Kne e%20High%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Knee-High</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=thigh%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Th igh%20High%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Thigh-High</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=pantyhose&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Panty hose%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Pantyhose</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=athletic&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Athlet ic%20AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Athletic</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=casual&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Casual%2 0AND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=dress&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Dress%20A ND%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a></li>
    </ul>
    </dd>
    <dt onclick="javascript:show('smenu3');"><a href="http://www.supportplus.com/mens_hose.cfm?catx=msh&gender=men&title=Men's%20Medical%20Support%20Hose"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Men's</b></font></a></dt>
    <dd id="smenu3" style='display:none'>
    <ul>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=jobst&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Jobst%20AND %20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Jobst</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=futuro&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Futuro%20A ND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Futuro</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=bauer%20black&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Bau er%20Black%20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Bauer & Black</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=support%20plus&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Su pport%20Plus%20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Support Plus</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Compression</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=mild&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Mild%20AND%2 0MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Mild (8-15)</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=moderate&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Moderate %20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Moderate (15-20)</font></a></li>
    <li><a href="#http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Firm%20AND%2 0MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Firm (20-30)</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=very%20firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Very% 20Firm%20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Very Firm (30+)</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=knee%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Knee% 20High%20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Knee-High</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=thigh%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Thig h%20High%20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Thigh-High</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=athletic&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Athletic %20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Athletic</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=casual&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Casual%20A ND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=dress&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Dress%20AND %20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a></li>
    </ul>
    </dd>
    <dt onclick="javascript:show('smenu4');"><a href="http://www.supportplus.com/socks.cfm?catx=tsocks&title=Therapeutic%20Socks"><font size="small" color="#3c4d5f">&nbsp;<b>Therapeutic Socks</b></font></a></dt>
    <dd id="smenu4" style='display:none' >
    <ul>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=tsocks&active=fordiab&CATEGORY=Therapeutic%20Socks&TYPE=Diabetes&refine.x=12&r efine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;For Diabetes</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=tsocks&active=athletic&CATEGORY=Therapeutic%20Socks&TYPE=Athletic&refine.x=12& refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Athletic</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=tsocks&active=casual&CATEGORY=Therapeutic%20Socks&TYPE=Casual&refine.x=12&refi ne.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=tsocks&active=dress&CATEGORY=Therapeutic%20Socks&TYPE=Dress&refine.x=12&refine .y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=tsocks&active=widecalf&CATEGORY=Therapeutic%20Socks&TYPE=Wide%20Calf&refine.x= 12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Wide Calf</font></a></li>
    </ul>
    </dd>
    <dt onclick="javascript:show();"><a href="http://www.supportplus.com/shoes_footwear.cfm?title=Shoes%20&%20Footware"><font size="small" color="#3c4d5f">&nbsp;<b>Shoes/Footwear</b></font></a></dt>
    <dt onclick="javascript:show('smenu5');"><a href="http://www.supportplus.com/womens_shoes.cfm?gender=Women&catx=ws&title=Women's%20Shoes"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Women's</b></font></a></dt>
    <dd id="smenu5" style='display:none'>
    <ul>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=drew&CATEGORY=Shoes%20Footwear&TYPE=Drew%20AND%20Womens &refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Drew</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=clinic&CATEGORY=Shoes%20Footwear&TYPE=Clinic%20AND%20Wo mens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Clinic/Footthrills</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=softspots&CATEGORY=Shoes%20Footwear&TYPE=Softspots%20AN D%20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Lowell/Softspots</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=other&CATEGORY=Shoes%20Footwear&TYPE=Womens%20NOT%20Dre w%20NOT%20Clinic%20NOT%20Lowell%20NOT%20Soft%20spots&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Other</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=sandal&CATEGORY=Shoes%20Footwear&TYPE=Sandal%20AND%20Wo mens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Sandal</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=boot&CATEGORY=Shoes%20Footwear&TYPE=Boot%20AND%20Womens &refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Boot</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=casual&CATEGORY=Shoes%20Footwear&TYPE=Casual%20AND%20Wo mens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=dress&CATEGORY=Shoes%20Footwear&TYPE=Dress%20AND%20Wome ns&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=slipper&CATEGORY=Shoes%20Footwear&TYPE=Slipper%20AND%20 Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Slipper</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ws&gender=Women&active=Thera&CATEGORY=Shoes%20Footwear&TYPE=Therapeutic%20AND% 20Womens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Therapeutic</font></a></li>
    </ul>
    </dd>
    <dt onclick="javascript:show('smenu6');"><a href="http://www.supportplus.com/mens_shoes.cfm?catx=ms&gender=men&title=Men's%20Shoes"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Men's</b></font></a></dt>
    <dd id="smenu6" style='display:none'>
    <ul>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=drew&CATEGORY=Shoes%20Footwear&TYPE=Drew%20AND%20MENS&ref ine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Drew</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=hushpuppies&CATEGORY=Shoes%20Footwear&TYPE=Hush%20Puppies %20AND%20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Hush Puppies</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=&CATEGORY=Shoes%20Footwear&TYPE=New%20Balance%20AND%20MEN S&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;New Balance</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=softspots&CATEGORY=Shoes%20Footwear&TYPE=Softspots%20AND% 20MENS&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Lowell/Softspots</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=other&CATEGORY=Shoes%20Footwear%20AND%20MENS&TYPE=NOT%20D REW%20NOT%20Hush%20Puppies%20NOT%20Softspots%20NOT%20NEW%20Balance&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Other</font></a></li>
    <li><a href="#"><font size="small" color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=sandal&CATEGORY=Shoes%20Footwear&TYPE=Sandal%20AND%20Mens &refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Sandal</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=Boot&CATEGORY=Shoes%20Footwear&TYPE=Boot%20AND%20Mens&ref ine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Boot</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=Casual&CATEGORY=Shoes%20Footwear&TYPE=Casual%20AND%20Mens &refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=Dress&CATEGORY=Shoes%20Footwear&TYPE=Dress%20AND%20Mens&r efine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=Slipper&CATEGORY=Shoes%20Footwear&TYPE=Slipper%20AND%20Me ns&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Slipper</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=ms&gender=men&active=thera&CATEGORY=Shoes%20Footwear&TYPE=Therapeutic%20AND%20 Mens&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Therapeutic</font></a></li>
    </ul>
    </dd>
    <dt onclick="javascript:show('smenu7');"><a href="http://www.supportplus.com/diabetes.cfm?catx=diabcare&title=Diabetes%20Care"><font size="small" color="#3c4d5f">&nbsp;<b>Diabetes Care</b></font></a></dt>
    <dd id="smenu7" style='display:none'>
    <ul>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=diabcare&active=socks&CATEGORY=Diabetes%20Care&TYPE=Socks&refine.x=12&refine.y =10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Socks</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=diabcare&active=fotwear&CATEGORY=Shoes%20Footwear&TYPE=Diabetes&refine.x=12&re fine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Footwear</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=diabcare&active=skincare&CATEGORY=Diabetes%20Care&TYPE=Skin%20Care&refine.x=12 &refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Skin Care</font></a></li>
    <li><a href="http://www.supportplus.com/product_list.cfm?catx=diabcare&active=other&SEARCH_CRITERIA=Diabetes%20NOT%20Skin%20Care%20NOT%20Foo twear%20NOT%20SOCKS%20NOT%20Shoes&refine.x=12&refine.y=10"><font size="small" color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;Other</font></a></li>
    </ul>
    </dd>
    </dl>


    thanks!!!

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,504
    Thanks
    3
    Thanked 501 Times in 488 Posts
    to stay open when the user is taken to the linked page..
    dont understand how the menu can exist when above happens

    but it would be normal to use a cookie to remember the menu state when the page is revisited/refreshed

    see
    http://www.vicsjavascripts.org.uk/Me...MenuMemory.htm

  • #3
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    the menu is an included page...everytime a new page is loaded the menu shows up in its "block" state. If the user clicks on one of the submenus I want that submenu to stay open on the next page...very frustrating

  • #4
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    anyone else out there got a solution? it'd be greatly appreciated!

  • #5
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Got It

    Since nobody was able to help me I banged my head against my monitor for a few days and came up with the script. Here's the JS with a small snippet of some of the code:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <-- "Your CSS Goes Here" -->
    </style>
    <script type="text/javascript">

    var persistmenu="yes" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
    var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only

    if (document.getElementById){ //DynamicDrive.com change
    document.write('<style type="text/css">\n')
    document.write('.submenu{display: none;}\n')
    document.write('</style>\n')
    }

    function SwitchMenu(obj){
    if(document.getElementById){
    var el = document.getElementById(obj);
    var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
    if(el.style.display != "block"){ //DynamicDrive.com change
    for (var i=0; i<ar.length; i++){
    if (ar[i].className=="submenu") //DynamicDrive.com change
    ar[i].style.display = "none";
    }
    el.style.display = "block";
    }else{
    el.style.display = "none";
    }
    }
    }

    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
    offset += search.length
    end = document.cookie.indexOf(";", offset);
    if (end == -1) end = document.cookie.length;
    returnvalue=unescape(document.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }

    function onloadfunction(){
    if (persistmenu=="yes"){
    var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
    var cookievalue=get_cookie(cookiename)
    if (cookievalue!="")
    document.getElementById(cookievalue).style.display="block"
    }
    }

    function savemenustate(){
    var inc=1, blockid=""
    while (document.getElementById("sub"+inc)){
    if (document.getElementById("sub"+inc).style.display=="block"){
    blockid="sub"+inc
    break
    }
    inc++
    }
    var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
    var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
    document.cookie=cookiename+"="+cookievalue
    }

    if (window.addEventListener)
    window.addEventListener("load", onloadfunction, false)
    else if (window.attachEvent)
    window.attachEvent("onload", onloadfunction)
    else if (document.getElementById)
    window.onload=onloadfunction

    if (persistmenu=="yes" && document.getElementById)
    window.onunload=savemenustate

    </script>
    </head>

    <body>
    <!-- Keep all menus within masterdiv-->
    <div id="masterdiv">

    <div class="menutitle" onclick="SwitchMenu('sub1')"><A STYLE="text-decoration:none" href="http://www.supportplus.com/Medical_Support_Hose.cfm?catx=&title=Medical%20Support%20Hose"><font color="#3c4d5f">&nbsp;<b>Medical Support Hose</b></font></a></div>
    <span class="submenu" id="sub1"></span>
    <div class="menutitle" onclick="SwitchMenu('sub2')"><A STYLE="text-decoration:none" href="http://www.supportplus.com/womens_hose.cfm?gender=Women&catx=wsh&title=Women's%20Medical%20Support%20Hose"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Women's</b></font></a></div>
    <span class="submenu" id="sub2">
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=jobst&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Jobst%20A ND%20Womens&&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Jobst</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=futuro&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Futuro%2 0AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Futuro</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=bauer%20black&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=B auer%20Black%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Bauer & Black</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=support%20plus&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE= Support%20Plus%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Support Plus</font></a>
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Compression</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=mild&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Mild%20AND %20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Mild (8-15)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=moderate&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Modera te%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Moderate (15-20)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Firm%20AND %20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Firm (20-30)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=very%20firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Ver y%20Firm%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Very Firm (30+)</font></a>
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=knee%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Kne e%20High%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Knee-High</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=thigh%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Th igh%20High%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Thigh-High</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=pantyhose&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Panty hose%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Pantyhose</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=athletic&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Athlet ic%20AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Athletic</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=casual&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Casual%2 0AND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=wsh&gender=women&active=dress&CATEGORY=MEDICAL%20SUPPORT%20HOSE&Type=Dress%20A ND%20Womens&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a>
    </span>

    <div class="menutitle" onclick="SwitchMenu('sub3')"><A STYLE="text-decoration:none" href="http://www.supportplus.com/mens_hose.cfm?catx=msh&gender=men&title=Men's%20Medical%20Support%20Hose"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>Men's</b></font></a></div>
    <span class="submenu" id="sub3">
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Brand</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=jobst&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Jobst%20AND %20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Jobst</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=futuro&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Futuro%20A ND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Futuro</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=bauer%20black&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Bau er%20Black%20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Bauer & Black</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=support%20plus&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Su pport%20Plus%20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Support Plus</font></a>
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Compression</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=mild&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Mild%20AND%2 0MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Mild (8-15)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=moderate&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Moderate %20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Moderate (15-20)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Firm%20AND%2 0MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Firm (20-30)</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=very%20firm&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Very% 20Firm%20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Very Firm (30+)</font></a>
    <A STYLE="text-decoration:none" href="#"><font color="#3c4d5f">&nbsp;&nbsp;&nbsp;<b>By Style</b></font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=knee%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Knee% 20High%20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Knee-High</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=thigh%20high&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Thig h%20High%20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Thigh-High</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=athletic&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Athletic %20AND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Athletic</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=casual&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Casual%20A ND%20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Casual</font></a>
    <A STYLE="text-decoration:none" href="http://www.supportplus.com/product_list.cfm?catx=msh&gender=men&active=dress&CATEGORY=MEDICAL%20SUPPORT%20HOSE&TYPE=Dress%20AND %20MENS&refine.x=12&refine.y=10"><font color="#526981">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dress</font></a>
    </span>
    </div>
    </body>
    </html>

    The problem was that my site contains over 24,000 dynamic pages and couldn't place an "id" within each page, so I used a cookie instead.

    Thanks to dynamic drive for a little help on this...the rest is mine, hope this is useful for anyone out there needing a dynamic menu that follows your users throughout your site.


  •  

    Posting Permissions

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