ui.accordion I want to have active sub-menu load expanded
Hi folks,
Background:
I just registered, I am new to this forum, I am new to jQuery and I am new to JavaScript. But am very excited to learn it and use it in my web development.
I have experience in Java, so understand the JavaScript syntax, except for the obvious differences.
Please note that I have looked through the API, searched Google, and tried my best to find clarification on my own, with no avail.
Problem:
I have implemented a navigation menu that has 2 submenus and am utilizing jQuery and ui.Accordion to make the submenus slide open and closed. With CSS, I have successfully made it so that within my <ul>, if my <body>'s ID tag == <a>'s ID tag, then that selected <a> will have a different background color.
My problem is, if we're within one of the subsections of ABOUT and SERVICES (the only two sections that have submenus that use jQuery/accordion) how does that particular menu load in expanded mode when the user is on a page within that section?
Some of my code to give you a better idea:
Within the <head>...
-
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="ui.core.js"></script>
<script type="text/javascript" src="ui.accordion.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// applying the settings
$('#nav').accordion({
active: 'h3.selected',
header: 'h3.head',
collapsible: true,
showSpeed: 400,
hideSpeed: 800
});
});
</script>
My navigation menu....
-
<ul id="nav" class="yui-b">
<li><h3><a href="index.php">Home</a></h3></li>
<li><h3 class="head"><a href="#">About Us</a></h3>
<ul class="subnav">
<li><a href="drkhodadadi.php" id="a_aboutdr"> Meet Dr. Khodadadi</a></li>
<li><a href="aboutclinic.php" id="a_aboutclinic"> About Our Clinic</a></li>
</ul></li>
<li><h3 class="head"><a href="#">Services</a></h3>
<ul class="subnav">
<li><a href="aboutservices.php" id="a_aboutservices"> About Our Services</a></li>
<li><a href="services.php" id="a_services"> Types of Treatments</a></li>
</ul></li>
<li><h3><a href="footcare.php" id="a_footcare">Foot Care</a></h3></li>
<li><h3><a href="chiropractic.php" id="a_chiropractic">What Is Chiropractic?</a></h3></li>
<li><h3><a href="attorneys.php" id="a_attorneys">Attorneys</a></h3></li>
<li><h3><a href="resources.php" id="a_resources">Health Resources</a></h3></li>
<li><h3><a href="testimonials.php" id="a_testimonials">Testimonials</a></h3></li>
<li><h3><a href="contact.php" id="a_contact">Contact Us</a></h3></li>
</ul>
Thanks in advance. Any help will be greatly appreciated. If you need any more details or specifications let me know, I will be glad to provide them.