jQuery Vallenato手风琴显示器

时间:2013-01-14 23:59:40

标签: jquery accordion default

此jQuery手风琴脚本默认显示第一个手风琴内容。如何设置默认显示的第三个手风琴内容?

$(document).ready(function()
{
//Add Inactive Class To All Accordion Headers
$('.accordion-header').toggleClass('inactive-header');

//Set The Accordion Content Width
var contentwidth = $('.accordion-header').width();
$('.accordion-content').css({'width' : contentwidth });

//Open The First Accordion Section When Page Loads
$('.accordion-header').first().toggleClass('active-header').toggleClass('inactive-header');
$('.accordion-content').first().slideDown().toggleClass('open-content');


// The Accordion Effect
$('.accordion-header').click(function () {
    if($(this).is('.inactive-header')) {
        $('.active-header').toggleClass('active-header').toggleClass('inactive-header').next().slideToggle().toggleClass('open-content');
        $(this).toggleClass('active-header').toggleClass('inactive-header');
        $(this).next().slideToggle().toggleClass('open-content');
    }

    else {
        $(this).toggleClass('active-header').toggleClass('inactive-header');
        $(this).next().slideToggle().toggleClass('open-content');
    }
});

return false;
});

http://www.switchroyale.com/vallenato/

1 个答案:

答案 0 :(得分:1)

删除以下行:

//Open The First Accordion Section When Page Loads
$('.accordion-header').first().toggleClass('active-header').toggleClass('inactive-header');
$('.accordion-content').first().slideDown().toggleClass('open-content');

并添加:

$('.accordion-header:eq(2)').toggleClass('active-header').toggleClass('inactive-header');
$('.accordion-content:eq(2)').slideDown().toggleClass('open-content');

:eq(2)部分定义默认部分