I got this to work finally by passing in the ID of the toggle i want to set active.
On Nov 5, 11:01 am, KCWebMonkey <[EMAIL PROTECTED]> wrote: > I have an accordion which i am trying to activate on page load, and > the .activate function doesn't appear to be working. can someone show > me how i'm implementing it incorrectly? > > JavaScript: > > $(document).ready(function() { > $('#childnav').accordion({ > autoheight: false, > header: '.toggle', > event: 'click', > alwaysOpen: true, > active: false > }); > > $(".toggle").activate(0); > }); > > HTML: > > <ul id="childnav"> > <li id="childnav_about"> > <div style="width:277px;height:5px;background:#014F75;"></div> > <a href="#" class="toggle"><span>About Us</span></a> > <ul class="childnav_sub"> > <li><a href="#">Link 1</a></li> > <li><a href="#">Link 2</a></li> > </ul> > </li> > <li id="childnav_homes"> > <img src="/images/childnav_spacer.jpg" alt="" /> > <a href="#" class="toggle"><span>New Homes</span></a> > <ul class="childnav_sub"> > <li><a href="#">another link</a></li> > <li><a href="#">another link</a></li> > </ul> > </li> > <li id="childnav_community"> > <img src="/images/childnav_spacer.jpg" alt="" /> > <a href="#" class="toggle"><span>The Community</span></a> > <ul class="childnav_sub"> > <li><a href="#">Arial PhotoGraph</a></li> > <li><a href="#">Amenities</a></li> > <li><a href="#">Schools</a></li> > <li><a href="#">Utilities</a></li> > </ul> > </li> > <li id="childnav_news"> > <img src="/images/childnav_spacer.jpg" alt="" /> > <a href="#" class="toggle"><span>News & Events</span></a> > <ul class="childnav_sub"> > <li><a href="#">Link 1</a></li> > <li><a href="#">Link 2</a></li> > <li><a href="#">Link 1</a></li> > <li><a href="#">Link 2</a></li> > <li><a href="#">Link 1</a></li> > <li><a href="#">Link 2</a></li> > </ul> > </li> > <li id="childnav_contact"> > <img src="/images/childnav_spacer.jpg" alt="" /> > <a href="#" class="toggle"><span>Contact Us</span></a> > <ul class="childnav_sub"> > <li><a href="#">Link 1</a></li> > <li><a href="#">Link 2</a></li> > <li><a href="#">Link 1</a></li> > </ul> > </li> > </ul>