CODEWITHSUNDEEP
jqueryaccordionjquery-ui-accordion
fightstarr20
fightstarr20

Reputation: 12598

jQuery accordion - Open item on page load

I have a real simple jQuery accordion based on http://www.stemkoski.com/stupid-simple-jquery-accordion-menu/

Everything works fine but I would like it to automatically have the first item in the list open when the page loads

I have everything in a jsfiddle at http://jsfiddle.net/HJ8c7/

Can anyone help?

Upvotes: 2

Views: 22419

Answers (3)

Endy
Endy

Reputation: 696

Do:

$( "#accordion" ).accordion( "option", "active", 0 );

It will open the first element.

Upvotes: 5

chhameed
chhameed

Reputation: 4456

you can just do it by jquery 

$(document).ready(function() {
 $(".accordionButton:first").trigger("click");
});

js fiddle demo live

jquery trigger mathod is used for trigger the event

.trigger( eventType [, extraParameters] )

Ref: Jquery trigger

Upvotes: 3

Leif
Leif

Reputation: 1126

You can do that pretty easy by triggering the click event. Based on your jsfiddle code:

jQuery('div.accordionButton').click(function() {
    jQuery('div.accordionContent').slideUp('normal');    
    jQuery(this).next().slideDown('normal');
});

jQuery("div.accordionContent").hide();
jQuery('div.accordionButton:eq(0)').trigger('click');

Apart from you original question, you may want to use jquery differently so that you do not have to use "jQuery" all the time. It is common to bind the jquery object to the $ variable:

jQuery(function($) {
     $('div.accordionContent:eq(0)').trigger('click');
});

Upvotes: -1

Related Questions