mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-26 14:54:27 +02:00
Code Issues Releases Wiki Activity

fix up dropdowns and navbar docs for the new dropdown styles

Browse Source
This commit is contained in:
Mark Otto
2012-01-07 21:09:02 -08:00
parent 343dd9616d
commit 95f47026cf
6 changed files with 223 additions and 245 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
docs/components.html
View File

@@ -386,27 +386,30 @@
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Secondary link</a></li>
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Another link</a></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
<form class="navbar-search pull-left" action="">
<input type="text" class="search-query span2" placeholder="Search">
</form>
<ul class="nav secondary-nav">
<ul class="nav pull-right">
<li><a href="#">Link</a></li>
<li class="vertical-divider"></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Secondary link</a></li>
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Another link</a></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
@@ -460,7 +463,8 @@
&lt;li&gt;&lt;a href="#"&gt;Link&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</pre>
<p>Adding dropdowns to the nav is super simple, but does require the use of <a href="./javascript.html/#dropdowns">our javascript plugin</a>.</p>
<h3>Adding dropdowns</h3>
<p>Adding dropdowns to the nav is super simple, but does require the use of <a href="./javascript.html/#dropdown">our javascript plugin</a>.</p>
<pre class="prettyprint linenums">
&lt;ul class="nav"&gt;
&lt;li class="dropdown"&gt;
@@ -468,6 +472,7 @@
class="dropdown-toggle"
data-toggle="dropdown">
Account
&lt;b class="caret"&gt;&lt;/b&gt;
&lt;/a&gt;
&lt;ul class="dropdown-menu"&gt;
...
@@ -475,6 +480,7 @@
&lt;/li&gt;
&lt;/ul&gt;
</pre>
<p><a class="btn" href="./javascript.html/#dropdown">Get the javascript &rarr;</a></p>
</div>
</div>

20
docs/javascript.html
View File

@@ -323,7 +323,7 @@ $('#myModal').on('hidden', function () {
&lt;ul class="tabs"&gt;
&lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
&lt;li id="secondary" class="dropdown"&gt;
&lt;a href="#secondary" class="dropdown-toggle" data-toggle="dropdown"&gt;Dropdown &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
&lt;a href="#secondary" class="dropdown-toggle" data-toggle="dropdown"&gt;Dropdown &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
&lt;ul class="dropdown-menu"&gt;
&lt;li&gt;&lt;a href="#"&gt;Secondary link&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
@@ -349,23 +349,15 @@ $('#myModal').on('hidden', function () {
<form class="form-search navbar-search pull-left" action="">
<input type="text" class="search-query span2" placeholder="Search">
</form>
<ul class="nav secondary-nav">
<ul class="nav pull-right">
<li id="fat-menu" class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown 1 <span class="caret"></span></a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown 1 <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Secondary link</a></li>
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Another link</a></li>
</ul>
</li>
<li id="mdo-menu" class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Secondary link</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Another link</a></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>