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>