aboutsummaryrefslogtreecommitdiff
path: root/docs/components.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/components.html')
-rw-r--r--docs/components.html34
1 files changed, 14 insertions, 20 deletions
diff --git a/docs/components.html b/docs/components.html
index 7a25db4dd..11a23efb6 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -61,7 +61,7 @@
<a href="./javascript.html">Javascript</a>
</li>
<li class="">
- <a href="./extend.html">Extend</a>
+ <a href="./customize.html">Customize</a>
</li>
</ul>
</div>
@@ -113,7 +113,7 @@
</div>
<h2>Example</h2>
- <p>An isolated (without dropdown toggle) dropdown menu example, designed to be used with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.</p>
+ <p>Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="./javascript.html#dropdowns">dropdown javascript plugin</a>.</p>
<div class="bs-docs-example">
<div class="dropdown clearfix">
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px;">
@@ -140,26 +140,20 @@
<h2>Markup</h2>
- <p>Dropdowns require...</p>
+ <p>Looking at just the dropdown menu, here's the required HTML. You need to wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then just create the menu.</p>
<pre class="prettyprint linenums">
-&lt;ul class="nav nav-pills"&gt;
- &lt;li class="active"&gt;&lt;a href="#"&gt;Regular link&lt;/a&gt;&lt;/li&gt;
- &lt;li class="dropdown" id="menu1"&gt;
- &lt;a id="dLabel" role="button" class="dropdown-toggle" data-toggle="dropdown" href="#menu1"&gt;
- Dropdown
- &lt;b class="caret"&gt;&lt;/b&gt;
- &lt;/a&gt;
- &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
- &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
- &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
- &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
- &lt;li class="divider"&gt;&lt;/li&gt;
- &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
- &lt;/ul&gt;
- &lt;/li&gt;
- ...
-&lt;/ul&gt;</pre>
+&lt;div class="dropdown"&gt;
+ &lt;!-- Link or button to toggle dropdown --&gt;
+ &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
+ &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
+ &lt;li class="divider"&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
+ &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
<hr class="bs-docs-separator">