aboutsummaryrefslogtreecommitdiff
path: root/docs/components/dropdowns.md
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2016-10-16 19:46:47 -0700
committerMark Otto <[email protected]>2016-10-16 19:46:47 -0700
commitb4cdccba84f7681e2911d307828c5ce94c856736 (patch)
treef8e1edddbd941adb255766889019248ffa399d0a /docs/components/dropdowns.md
parent05bdecd0b09a007ae949f49fdff9006650c06969 (diff)
parent6d6538fc81ebdb9e29ca5a5a4e8e5768b9358fe9 (diff)
downloadbootstrap-b4cdccba84f7681e2911d307828c5ce94c856736.tar.xz
bootstrap-b4cdccba84f7681e2911d307828c5ce94c856736.zip
Merge branch 'v4-dev' into v4-navbars
Diffstat (limited to 'docs/components/dropdowns.md')
-rw-r--r--docs/components/dropdowns.md19
1 files changed, 3 insertions, 16 deletions
diff --git a/docs/components/dropdowns.md b/docs/components/dropdowns.md
index affaadc6e..68c388f21 100644
--- a/docs/components/dropdowns.md
+++ b/docs/components/dropdowns.md
@@ -1,6 +1,7 @@
---
layout: docs
title: Dropdowns
+description: Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.
group: components
---
@@ -36,7 +37,7 @@ And with `<a>` elements:
{% example html %}
<div class="dropdown open">
- <a class="btn btn-secondary dropdown-toggle" href="http://example.com" id="dropdownMenuLink" data-target="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ <a class="btn btn-secondary dropdown-toggle" href="https://example.com" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown link
</a>
@@ -361,7 +362,7 @@ Trigger dropdown menus above elements by adding `.dropup` to the parent element.
<button type="button" class="btn btn-secondary">
Split dropup
</button>
- <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
</button>
<div class="dropdown-menu">
@@ -500,20 +501,6 @@ Add `data-toggle="dropdown"` to a link or button to toggle a dropdown.
</div>
{% endhighlight %}
-To keep URLs intact with link buttons, use the `data-target` attribute instead of `href="#"`.
-
-{% highlight html %}
-<div class="dropdown">
- <a id="dLabel" data-target="#" href="http://example.com" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
- Dropdown trigger
- </a>
-
- <div class="dropdown-menu" aria-labelledby="dLabel">
- ...
- </div>
-</div>
-{% endhighlight %}
-
### Via JavaScript
Call the dropdowns via JavaScript: