accordion

I have a rather basic implementation of a jQuery Accordion on a page (using 1.3.2, jQuery UI Core 1.72 and jQuery UI Accordion 1.7.2), and I wish to open the 2nd section when the page loads. i've tried numerous methods but nothing seems to work... HEAD SCRIPT: <script type="text/javascript"> $(function() { $("#accordion").accordion({ event: "mouseover" }); }); BODY ACCORDION: <div id="accordion"> <h3><a href="#">Headline 001</a></h3> <div> <ul> <li><a href="#1">Link 001</a></li> <li><a href="#2">Link 002</a></li> </ul> </div> <h3><a href="#">Headline 002</a></h3> <div> <ul> <li><a href="#3"

Several questions here on SO reference this open jQuery UI feature request for the ability to dynamically add/remove panels from the Accordion widget. The ticket itself is marked (closed feature: fixed) and from what I can tell from the unit tests and a pull from their Git repository it appears to be implemented in the latest release. However if I try to add a div like they did in the unit test above: var element = $("#accordion"); $("#accordion").append("<h3>3</h3><div>3</div>"); $("#accordion").accordion("refresh"); I can't get it to work. However this method works: $("#accordion").append("

I am testing a site build with a slow connection and I noticed the jQuery Accordion stays expanded for a long time, until the rest of the site is loaded, and then finally collapses. Not very pretty. I was wondering how I could keep it collapsed through the loading process and only expand when clicked. I am working with the standalone 1.6 version of the accordion plugin. The basic structure : <div class="sidebar"> <ul id="navigation" class="ui-accordion-container"> <li><a class="head" href="#">1</a> <ul class="sub"> <li><a href="#">1a</a></li> <li><a href="#">2a</a></li> </ul> </li> </ul> </div

Update I am making this a community wiki, for three reasons: I don't feel like I got a definitive answer, but I have long since stopped needing an answer, because I rolled my own accordion function this question gets tons of views, so clearly lots of people are still interested So if anybody wants to change/clarify this question and make it a definitive guide, be my guest. I'm working on a page using jQuery's accordion UI element . I modeled my HTML on that example, except that inside the <li> elements, I have some unordered lists of links. Like this: $(document).ready(function() { $(".ui

I'm using this: jsfiddle.net/wromLbq5 And am hoping to have the ability to have multiple accordion sections open at once, and on page load. By this I mean, when one opens, I don't want the other to close. Is this possible? Without javascript as well. (Ignore all the sub accordions too- I only need one layer) HTML <ul class="accordion"> <li id="one" class="files"> <a href="#one">My Files<span>495</span></a> <ul class="sub-menu"> <li><a href="#one"><em>01</em>Dropbox<span>42</span></a></li> <li><a href="#one"><em>02</em>Skydrive<span>87</span></a></li> <li><a href="#one"><em>03</em>FTP Server

I have a jquery accordion which I want to add rows to. I can accomplish this by calling .accordion("destroy"), adding the needed <h3></h3><div> ... bit and then calling .accordion() again, but this destroys the state and closes any dividers which are open. Is it possible to add rows to the accordion without destroy and recreating it? No it is not possible. jQuery should add an "add" method to accordion like they have for tabs: //save state var state = $("#accordion").accordion( "option", "active" ); //add accordion item, destroy then re-create $("#accordion").append("<h3></h3><div/>")