diff options
| author | Mark Otto <[email protected]> | 2014-11-29 23:03:47 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2014-11-29 23:03:47 -0800 |
| commit | 9928144dc4e8301ee0dd02ac073682d789b2adb1 (patch) | |
| tree | 16e441dd6baca9d00f0a36bb77df76418cc9d6be /docs/_includes | |
| parent | 23bdfc45eb6da41ceaa59803caa667a8f8d4de4d (diff) | |
| download | bootstrap-9928144dc4e8301ee0dd02ac073682d789b2adb1.tar.xz bootstrap-9928144dc4e8301ee0dd02ac073682d789b2adb1.zip | |
Fixes #15241: Add simple example to docs for collapse plugin
Diffstat (limited to 'docs/_includes')
| -rw-r--r-- | docs/_includes/js/collapse.html | 28 | ||||
| -rw-r--r-- | docs/_includes/nav/javascript.html | 3 |
2 files changed, 28 insertions, 3 deletions
diff --git a/docs/_includes/js/collapse.html b/docs/_includes/js/collapse.html index a60e91c83..b7a9acacc 100644 --- a/docs/_includes/js/collapse.html +++ b/docs/_includes/js/collapse.html @@ -9,8 +9,32 @@ <p>Collapse requires the <a href="#transitions">transitions plugin</a> to be included in your version of Bootstrap.</p> </div> - <h2 id="collapse-examples">Example accordion</h2> - <p>Using the collapse plugin, we built a simple accordion by extending the panel component.</p> + <h2 id="collapse-example">Example</h2> + <p>Click the button below to show and hide another element.</p> + + <div class="bs-example"> + <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> + Toggle hidden content + </button> + <div class="collapse" id="collapseExample"> + <div class="well"> + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. + </div> + </div> + </div> +{% highlight html %} +<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> + Toggle hidden content +</button> +<div class="collapse" id="collapseExample"> + <div class="well"> + ... + </div> +</div> +{% endhighlight %} + + <h2 id="collapse-example-accordion">Accordion example</h2> + <p>You can extend the collapse plugin with the panel component to create an accordion.</p> <div class="bs-example"> <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> diff --git a/docs/_includes/nav/javascript.html b/docs/_includes/nav/javascript.html index 711713e43..76e6732f8 100644 --- a/docs/_includes/nav/javascript.html +++ b/docs/_includes/nav/javascript.html @@ -92,7 +92,8 @@ <li> <a href="#collapse">Collapse</a> <ul class="nav"> - <li><a href="#collapse-examples">Examples</a></li> + <li><a href="#collapse-example">Example</a></li> + <li><a href="#collapse-example-accordion">Accordion example</a></li> <li><a href="#collapse-usage">Usage</a></li> <li><a href="#collapse-options">Options</a></li> <li><a href="#collapse-methods">Methods</a></li> |