JS docs: add Options, Methods, Events subsections to nav sidebar

docs/_includes/js/affix.html

@@ -42,7 +42,7 @@ $('#myAffix').affix({
 {% endhighlight %}
 
 
-  <h3>Options</h3>
+  <h3 id="affix-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-offset-top="200"</code>.</p>
 
   <div class="table-responsive">
@@ -74,7 +74,7 @@ $('#myAffix').affix({
   </div><!-- /.table-responsive -->
 
 
-  <h3>Events</h3>
+  <h3 id="affix-events">Events</h3>
   <p>Bootstrap's affix plugin exposes a few events for hooking into affix functionality.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">

docs/_includes/js/alerts.html

@@ -35,7 +35,7 @@
 
   <p>To have your alerts use animation when closing, make sure they have the <code>.fade</code> and <code>.in</code> classes already applied to them.</p>
 
-  <h3>Methods</h3>
+  <h3 id="alerts-methods">Methods</h3>
 
   <h4>$().alert()</h4>
   <p>Makes an alert listen for click events on descendant elements which have the <code>data-dismiss="alert"</code> attribute. (Not necessary when using the data-api's auto-initialization.)</p>
@@ -44,7 +44,7 @@
   <p>Closes an alert by removing it from the DOM. If the <code>.fade</code> and <code>.in</code> classes are present on the element, the alert will fade out before it is removed.</p>
 
 
-  <h3>Events</h3>
+  <h3 id="alerts-events">Events</h3>
   <p>Bootstrap's alert plugin exposes a few events for hooking into alert functionality.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">

docs/_includes/js/carousel.html

@@ -152,7 +152,7 @@
 $('.carousel').carousel()
 {% endhighlight %}
 
-  <h3>Options</h3>
+  <h3 id="carousel-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -193,7 +193,7 @@ $('.carousel').carousel()
     </table>
   </div><!-- /.table-responsive -->
 
-  <h3>Methods</h3>
+  <h3 id="carousel-methods">Methods</h3>
 
   <h4>.carousel(options)</h4>
   <p>Initializes the carousel with an optional options <code>object</code> and starts cycling through items.</p>
@@ -219,7 +219,7 @@ $('.carousel').carousel({
   <h4>.carousel('next')</h4>
   <p>Cycles to the next item.</p>
 
-  <h3>Events</h3>
+  <h3 id="carousel-events">Events</h3>
   <p>Bootstrap's carousel class exposes two events for hooking into carousel functionality.</p>
   <p>Both events have the following additional properties:</p>
   <ul>

docs/_includes/js/collapse.html

@@ -161,7 +161,7 @@
 $('.collapse').collapse()
 {% endhighlight %}
 
-  <h3>Options</h3>
+  <h3 id="collapse-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-parent=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -190,7 +190,7 @@ $('.collapse').collapse()
     </table>
   </div><!-- /.table-responsive -->
 
-  <h3>Methods</h3>
+  <h3 id="collapse-methods">Methods</h3>
 
   <h4>.collapse(options)</h4>
   <p>Activates your content as a collapsible element. Accepts an optional options <code>object</code>.
@@ -209,7 +209,7 @@ $('#myCollapsible').collapse({
   <h4>.collapse('hide')</h4>
   <p>Hides a collapsible element.</p>
 
-  <h3>Events</h3>
+  <h3 id="collapse-events">Events</h3>
   <p>Bootstrap's collapse class exposes a few events for hooking into collapse functionality.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">

docs/_includes/js/dropdowns.html

@@ -155,14 +155,14 @@ $('.dropdown-toggle').dropdown()
     <p>Regardless of whether you call your dropdown via JavaScript or instead use the data-api, <code>data-toggle="dropdown"</code> is always required to be present on the dropdown's trigger element.</p>
   </div>
 
-  <h3>Options</h3>
+  <h3 id="dropdowns-options">Options</h3>
   <p><em>None</em></p>
 
-  <h3>Methods</h3>
+  <h3 id="dropdowns-methods">Methods</h3>
   <h4>$().dropdown('toggle')</h4>
   <p>Toggles the dropdown menu of a given navbar or tabbed navigation.</p>
 
-  <h3>Events</h3>
+  <h3 id="dropdowns-events">Events</h3>
   <p>All dropdown events are fired at the <code>.dropdown-menu</code>'s parent element.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">

docs/_includes/js/modal.html

@@ -306,7 +306,7 @@ $('#exampleModal').on('show.bs.modal', function (event) {
   <p>Call a modal with id <code>myModal</code> with a single line of JavaScript:</p>
   {% highlight js %}$('#myModal').modal(options){% endhighlight %}
 
-  <h3>Options</h3>
+  <h3 id="modals-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-backdrop=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -353,7 +353,7 @@ $('#exampleModal').on('show.bs.modal', function (event) {
     </table>
   </div><!-- /.table-responsive -->
 
-  <h3>Methods</h3>
+  <h3 id="modals-methods">Methods</h3>
 
   <h4>.modal(options)</h4>
   <p>Activates your content as a modal. Accepts an optional options <code>object</code>.</p>
@@ -375,7 +375,7 @@ $('#myModal').modal({
   <p>Manually hides a modal. <strong>Returns to the caller before the modal has actually been hidden</strong> (i.e. before the <code>hidden.bs.modal</code> event occurs).</p>
   {% highlight js %}$('#myModal').modal('hide'){% endhighlight %}
 
-  <h3>Events</h3>
+  <h3 id="modals-events">Events</h3>
   <p>Bootstrap's modal class exposes a few events for hooking into modal functionality.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">

docs/_includes/js/popovers.html

@@ -137,7 +137,7 @@ sagittis lacus vel augue laoreet rutrum faucibus.">
   <p>Enable popovers via JavaScript:</p>
   {% highlight js %}$('#example').popover(options){% endhighlight %}
 
-  <h3>Options</h3>
+  <h3 id="popovers-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -266,7 +266,7 @@ sagittis lacus vel augue laoreet rutrum faucibus.">
   <h4>.popover('destroy')</h4>
   <p>Hides and destroys an element's popover.</p>
   {% highlight js %}$('#element').popover('destroy'){% endhighlight %}
-  <h3>Events</h3>
+  <h3 id="popovers-events">Events</h3>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
       <thead>

docs/_includes/js/scrollspy.html

@@ -93,7 +93,7 @@ $('body').scrollspy({ target: '.navbar-example' })
 {% endhighlight %}
 
 
-  <h3>Methods</h3>
+  <h3 id="scrollspy-methods">Methods</h3>
   <h4>.scrollspy('refresh')</h4>
   <p>When using scrollspy in conjunction with adding or removing of elements from the DOM, you'll need to call the refresh method like so:</p>
 {% highlight js %}
@@ -103,7 +103,7 @@ $('[data-spy="scroll"]').each(function () {
 {% endhighlight %}
 
 
-  <h3>Options</h3>
+  <h3 id="scrollspy-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-offset=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -126,7 +126,7 @@ $('[data-spy="scroll"]').each(function () {
     </table>
   </div><!-- ./bs-table-responsive -->
 
-  <h3>Events</h3>
+  <h3 id="scrollspy-events">Events</h3>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
       <thead>

docs/_includes/js/tabs.html

@@ -91,7 +91,7 @@ $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
 </div>
 {% endhighlight %}
 
-  <h3>Methods</h3>
+  <h3 id="tabs-methods">Methods</h3>
   <h4>$().tab</h4>
   <p>
     Activates a tab element and content container. Tab should have either a <code>data-target</code> or an <code>href</code> targeting a container node in the DOM.
@@ -118,7 +118,7 @@ $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
 </script>
 {% endhighlight %}
 
-  <h3>Events</h3>
+  <h3 id="tabs-events">Events</h3>
   <p>When showing a new tab, the events fire in the following order:</p>
   <ol>
     <li><code>hide.bs.tab</code> (on the current active tab)</li>

docs/_includes/js/tooltips.html

@@ -108,7 +108,7 @@ $('#example').tooltip(options)
 </div>
 {% endhighlight %}
 
-  <h3>Options</h3>
+  <h3 id="tooltips-options">Options</h3>
   <p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
@@ -208,7 +208,7 @@ $('#example').tooltip(options)
     <p>Options for individual tooltips can alternatively be specified through the use of data attributes, as explained above.</p>
   </div>
 
-  <h3>Methods</h3>
+  <h3 id="tooltips-methods">Methods</h3>
 
   <h4>$().tooltip(options)</h4>
   <p>Attaches a tooltip handler to an element collection.</p>
@@ -229,7 +229,7 @@ $('#example').tooltip(options)
   <p>Hides and destroys an element's tooltip.</p>
   {% highlight js %}$('#element').tooltip('destroy'){% endhighlight %}
 
-  <h3>Events</h3>
+  <h3 id="tooltips-events">Events</h3>
   <div class="table-responsive">
     <table class="table table-bordered table-striped">
       <thead>

docs/_includes/nav/javascript.html

@@ -19,6 +19,9 @@
     <li><a href="#modals-remove-animation">Remove animation</a></li>
     <li><a href="#modals-related-target">Varying content based on trigger button</a></li>
     <li><a href="#modals-usage">Usage</a></li>
+    <li><a href="#modals-options">Options</a></li>
+    <li><a href="#modals-methods">Methods</a></li>
+    <li><a href="#modals-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -26,6 +29,8 @@
   <ul class="nav">
     <li><a href="#dropdowns-examples">Examples</a></li>
     <li><a href="#dropdowns-usage">Usage</a></li>
+    <li><a href="#dropdowns-methods">Methods</a></li>
+    <li><a href="#dropdowns-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -33,6 +38,9 @@
   <ul class="nav">
     <li><a href="#scrollspy-examples">Examples</a></li>
     <li><a href="#scrollspy-usage">Usage</a></li>
+    <li><a href="#scrollspy-methods">Methods</a></li>
+    <li><a href="#scrollspy-options">Options</a></li>
+    <li><a href="#scrollspy-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -40,6 +48,8 @@
   <ul class="nav">
     <li><a href="#tabs-examples">Examples</a></li>
     <li><a href="#tabs-usage">Usage</a></li>
+    <li><a href="#tabs-methods">Methods</a></li>
+    <li><a href="#tabs-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -47,6 +57,9 @@
   <ul class="nav">
     <li><a href="#tooltips-examples">Examples</a></li>
     <li><a href="#tooltips-usage">Usage</a></li>
+    <li><a href="#tooltips-options">Options</a></li>
+    <li><a href="#tooltips-methods">Methods</a></li>
+    <li><a href="#tooltips-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -54,6 +67,8 @@
   <ul class="nav">
     <li><a href="#popovers-examples">Examples</a></li>
     <li><a href="#popovers-usage">Usage</a></li>
+    <li><a href="#popovers-options">Options</a></li>
+    <li><a href="#popovers-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -61,6 +76,8 @@
   <ul class="nav">
     <li><a href="#alerts-examples">Examples</a></li>
     <li><a href="#alerts-usage">Usage</a></li>
+    <li><a href="#alerts-methods">Methods</a></li>
+    <li><a href="#alerts-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -77,6 +94,9 @@
   <ul class="nav">
     <li><a href="#collapse-examples">Examples</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>
+    <li><a href="#collapse-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -84,6 +104,9 @@
   <ul class="nav">
     <li><a href="#carousel-examples">Examples</a></li>
     <li><a href="#carousel-usage">Usage</a></li>
+    <li><a href="#carousel-options">Options</a></li>
+    <li><a href="#carousel-methods">Methods</a></li>
+    <li><a href="#carousel-events">Events</a></li>
   </ul>
 </li>
 <li>
@@ -91,5 +114,7 @@
   <ul class="nav">
     <li><a href="#affix-examples">Examples</a></li>
     <li><a href="#affix-usage">Usage</a></li>
+    <li><a href="#affix-options">Options</a></li>
+    <li><a href="#affix-events">Events</a></li>
   </ul>
 </li>