Twitter引导3.0图标在崩溃时更改
Twitter引导3.0图标在崩溃时更改
提问于 2013-08-09 13:05:15
我希望图标/图标在折叠时改变，即从关闭的文件夹更改为打开的文件夹。
我找了很远很远的地方，在这上面读过一些线索，但都没有用。This thread was close,基本上就是我想要的。
怎么才能让它在Bootstrap 3中工作呢？
回答 10
Stack Overflow用户
回答已采纳
发布于 2015-02-06 17:01:36
这是一个基于CSS的解决方案，它依赖于默认的bootstrap.js崩溃实现。不需要额外的HTML标记(当然，可以随意用图标替换Font)。
<style>
.panel-title > a:before {
font-family: FontAwesome;
content: "\f07c";
padding-right: 5px;
}
.panel-title > a.collapsed:before {
content: "\f07b";
}
</style>Stack Overflow用户
发布于 2013-08-09 13:30:03
在Bootstrap 3中，collapse事件的处理方式不同。
$('#collapseDiv').on('shown.bs.collapse', function () {
$(".glyphicon").removeClass("glyphicon-folder-close").addClass("glyphicon-folder-open");
});
$('#collapseDiv').on('hidden.bs.collapse', function () {
$(".glyphicon").removeClass("glyphicon-folder-open").addClass("glyphicon-folder-close");
});演示：http://www.bootply.com/73101
Stack Overflow用户
发布于 2013-09-10 15:21:54
这个代码找到你的手风琴的ID‘手风琴’。当显示的事件在折叠的面板上触发时，图标会在标题面板(前一个元素)中找到，并在该HTML代码块中找到并更改您的字形图标元素：
$('#accordion .panel-collapse').on('shown.bs.collapse', function () {
$(this).prev().find(".glyphicon").removeClass("glyphicon-chevron-right").addClass("glyphicon-chevron-down");
});
//The reverse of the above on hidden event:
$('#accordion .panel-collapse').on('hidden.bs.collapse', function () {
$(this).prev().find(".glyphicon").removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-right");
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18147338
复制相关文章
相似问题
腾讯云开发者
