twitter-bootstrap Bootstrap 折叠加载在页面加载时折叠

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/24017622/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 20:53:44  来源:igfitidea点击:

Bootstrap Collapse loads collapsed on page load

twitter-bootstrapload

提问by Daniel W

the title pretty much covers the problem I'm having.

标题几乎涵盖了我遇到的问题。

I've a list on a website I'm developing and I have hidden things within collapsible elements.

我在我正在开发的网站上有一个列表,并且在可折叠元素中隐藏了一些东西。

The problem I have is that they are already collapsed on page load.

我的问题是它们已经在页面加载时折叠了。

Does anyone have any idea on how to fix this?

有没有人知道如何解决这个问题?

Thanks.

谢谢。

回答by Daniel W

Thanks for your comment Rob.

感谢您的评论罗布。

Figured it after looking through the HTML, I need to use collapsebut all but one were using collapse in.

在浏览了 HTML 之后想通了,我需要使用,collapse但除了一个都在使用collapse in.

Problem sorted :)

问题排序:)

Load collapsed on page load :

加载在页面加载时折叠:

<div id="collapseOne" class="panel-collapse collapse in">

Load hidden until clicked :

加载隐藏直到点击:

<div id="collapseOne" class="panel-collapse collapse">

回答by Robert Levy

Bootstrap documentation says this:

Bootstrap 文档是这样说的:

The collapse plugin utilizes a few classes to handle the heavy lifting:

.collapsehides the content

.collapse.inshows the content

.collapsingis added when the transition starts, and removed when it finishes

折叠插件利用几个类来处理繁重的工作:

.collapse隐藏内容

.collapse.in显示内容

.collapsing在过渡开始时添加,并在完成时移除

Edit your HTML accordingly (use collapse.in instead of collapse)

相应地编辑您的 HTML(使用 collapse.in 而不是 collapse)

回答by ImFarhad

As of bootstrap 4.2.1 if we want to show the collapsed content on load:

从 bootstrap 4.2.1 开始,如果我们想在加载时显示折叠的内容:

use collapse showclass to the div or any element you want to show.

使用折叠显示类到 div 或要显示的任何元素。

check the docs Bootstrap Collapse

检查文档Bootstrap 折叠