YouTipTabs with Dropdown
[Try it »](#) The result is shown below:  ## Options _No options._ ## Methods The dropdown toggle has a simple method to show or hide the dropdown menu. $().dropdown('toggle') ### Example The following example demonstrates the usage of the Dropdown plugin method: ## ExampleBootstrap Dropdown Plugin
(#) This chapter explained dropdown menus but did not cover the interactive part. This chapter will specifically explain the interaction of dropdown menus. Using the Dropdown plugin, you can add dropdown menus to any component (such as navigation bars, tabs, pill navigation menus, buttons, etc.).
If you want to reference the plugin's functionality separately, you need to include **dropdown.js**. Or, as mentioned in the (#) chapter, you can include _bootstrap.js_ or the minified version _bootstrap.min.js_.
## Usage
You can toggle the hidden content of the Dropdown plugin:
* **Via data attributes**: Add **data-toggle="dropdown"** to a link or button to toggle the dropdown menu, as shown below:
If you need to keep the link intact (useful when JavaScript is not enabled in the browser), use the **data-target** attribute instead of **href="#"**:
* **Via JavaScript**: To toggle the dropdown via JavaScript, use the following method: $('.dropdown-toggle').dropdown()
### Example
#### Inside a Navbar
The following example demonstrates the usage of a dropdown menu inside a navbar:
## Example
[Try it »](#)
The result is shown below:
!(#)
#### Inside Tabs
The following example demonstrates the usage of a dropdown menu inside tabs:
## Example
$(function() { $(".dropdown-toggle").dropdown('toggle'); });
[Try it »](#)
The result is shown below:
