我使用引导手风琴,其中,第一板始终是敞开的,并且是开放获取的一类面板在.我从我的jQuery代码检查,看看如果类包含类在它强调了锚.但目前所有锚点都突出显示.
我只是希望第一个锚点突出显示是打开的,休息关闭面板应该有一些不同的风格.
这是小提琴:小提琴
如您所见,所有锚标记都会突出显示.我想要第一个锚来获得一些不同的造型.整个想法是为手风琴添加加/减符号.
我有一个3级嵌套式bootstrap手风琴,工作正常,但我想在面板标题div中进行更改,我可以fa fa-chevron-down在手风琴打开时使用字体 - 真棒图标(不影响嵌套手风琴),fa fa-chevron-right手风琴是崩溃了.我正在使用此代码更改图标:
$('div.panel-collapse.collapse').on('shown.bs.collapse', function() {
$(this).parent().find(".fa-chevron-right").removeClass("fa-chevron-right").addClass("fa-chevron-down");
$(this).parent().find('.panel-heading').css('background', '#0271BC');
}).on('hidden.bs.collapse', function() {
$(this).parent().find(".fa-chevron-down").removeClass("fa-chevron-down").addClass("fa-chevron-right");
$(this).parent().find('.panel-heading').css('background', '#02A4EF');
});<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet">
<a href="#aspnetcore" class="accordion-toggle tutorial-panel-heading" data-toggle="collapse" data-parent="#accordion">
<div class="panel panel-default">
<div class="panel-heading outer web">
<h4 class="panel-title fonter font-light-text">
<i class="fa fa-chevron-down pull-right"></i> Getting Starting with ASP.NET Core 1.0
</h4>
</div>
<div id="aspnetcore" class="panel-collapse collapse outer-arrow">
<div class="panel-body">
<div class="panel-group" id="webdevelopment">
<a href="#frontend" class="accordion-toggle tutorial-panel-heading" data-toggle="collapse" data-parent="#webdevelopment">
<div class="panel panel-default">
<div class="panel-heading …