Jquery ui jQuery手风琴错误
页面加载时accordion应该被折叠…但在页面加载时它被扩展了,我不知道如何修复这个错误Jquery ui jQuery手风琴错误,jquery-ui,jquery,jquery-plugins,jquery-selectors,Jquery Ui,Jquery,Jquery Plugins,Jquery Selectors,页面加载时accordion应该被折叠…但在页面加载时它被扩展了,我不知道如何修复这个错误 $(document).ready(function() { //Add Inactive Class To All Accordion Headers $('.accordion-header').toggleClass('inactive-header'); //Set The Accordion Content Width var contentwidth = $(
$(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;
});
这是我的代码。对我来说,只是在accordion content div中添加display:none似乎起到了作用:
$('.accordion-content').css({'width' : contentwidth }).css('display':'none');
下面是它的一个实际演示:从示例中删除以下代码部分,它将按照您期望的方式工作:
//Open The First Accordion Section When Page Loads
$('.accordion-header').first().toggleClass('active-header').toggleClass('inactive-header');
$('.accordion-content').first().slideDown().toggleClass('open-content');
您应该阅读“您的”代码注释