Merge branch '2.3.0-wip' of github.com:twitter/bootstrap into 2.3.0-wip

1 files changed, 63 insertions, 50 deletions

diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache
index e6a8cef0c..e0b291e1d 100644
--- a/docs/templates/pages/javascript.mustache
+++ b/docs/templates/pages/javascript.mustache
@@ -335,21 +335,21 @@ $('#myModal').on('hidden', function () {
                     <li class="dropdown">
                       <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">{{_i}}Dropdown{{/i}} <b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
-                        <li><a tabindex="-1" href="http://google.com">{{_i}}Action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#anotherAction">{{_i}}Another action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                        <li class="divider"></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="http://google.com">{{_i}}Action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#anotherAction">{{_i}}Another action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                        <li role="presentation" class="divider"></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                       </ul>
                     </li>
                     <li class="dropdown">
                       <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">{{_i}}Dropdown 2 {{/i}}<b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
-                        <li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                        <li class="divider"></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                        <li role="presentation" class="divider"></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -357,11 +357,11 @@ $('#myModal').on('hidden', function () {
                     <li id="fat-menu" class="dropdown">
                       <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">{{_i}}Dropdown 3{{/i}} <b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
-                        <li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                        <li class="divider"></li>
-                        <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                        <li role="presentation" class="divider"></li>
+                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -377,31 +377,31 @@ $('#myModal').on('hidden', function () {
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">{{_i}}Dropdown{{/i}} <b class="caret"></b></a>
                 <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
-                  <li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                  <li class="divider"></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                  <li role="presentation" class="divider"></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                 </ul>
               </li>
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">{{_i}}Dropdown 2{{/i}} <b class="caret"></b></a>
                 <ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
-                  <li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                  <li class="divider"></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                  <li role="presentation" class="divider"></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                 </ul>
               </li>
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">{{_i}}Dropdown 3{{/i}} <b class="caret"></b></a>
                 <ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop5">
-                  <li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
-                  <li class="divider"></li>
-                  <li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
+                  <li role="presentation" class="divider"></li>
+                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
                 </ul>
               </li>
             </ul> <!-- /tabs -->
@@ -699,17 +699,17 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
           <p>{{_i}}Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use CSS3 for animations, and data-attributes for local title storage.{{/i}}</p>
           <p>{{_i}}Hover over the links below to see tooltips:{{/i}}</p>
           <div class="bs-docs-example tooltip-demo">
-            <p class="muted" style="margin-bottom: 0;">{{_i}}Tight pants next level keffiyeh <a href="#" rel="tooltip" title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" rel="tooltip" title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" rel="tooltip" title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" rel="tooltip" title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.{{/i}}
+            <p class="muted" style="margin-bottom: 0;">{{_i}}Tight pants next level keffiyeh <a href="#" data-toggle="tooltip" title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" data-toggle="tooltip" title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" data-toggle="tooltip" title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" data-toggle="tooltip" title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.{{/i}}
             </p>
           </div>{{! /example }}
 
           <h3>{{_i}}Four directions{{/i}}</h3>
           <div class="bs-docs-example tooltip-demo">
             <ul class="bs-docs-tooltip-examples">
-              <li><a href="#" rel="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</a></li>
-              <li><a href="#" rel="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</a></li>
-              <li><a href="#" rel="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</a></li>
-              <li><a href="#" rel="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</a></li>
+              <li><a href="#" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</a></li>
+              <li><a href="#" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</a></li>
+              <li><a href="#" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</a></li>
+              <li><a href="#" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</a></li>
             </ul>
           </div>{{! /example }}
 
@@ -747,7 +747,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
              </tr>
              <tr>
                <td>{{_i}}placement{{/i}}</td>
-               <td>{{_i}}string|function{{/i}}</td>
+               <td>{{_i}}string | function{{/i}}</td>
                <td>'top'</td>
                <td>{{_i}}how to position the tooltip{{/i}} - top | bottom | left | right</td>
              </tr>
@@ -766,8 +766,8 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
              <tr>
                <td>{{_i}}trigger{{/i}}</td>
                <td>{{_i}}string{{/i}}</td>
-               <td>'hover'</td>
-               <td>{{_i}}how tooltip is triggered{{/i}} - click | hover | focus | manual</td>
+               <td>'hover focus'</td>
+               <td>{{_i}}how tooltip is triggered{{/i}} - click | hover | focus | manual. {{_i}}Note you case pass trigger mutliple, space seperated, trigger types.{{/i}}</td>
              </tr>
              <tr>
                <td>{{_i}}delay{{/i}}</td>
@@ -779,6 +779,14 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
                 <p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
                </td>
              </tr>
+             <tr>
+               <td>{{_i}}container{{/i}}</td>
+               <td>{{_i}}string | false{{/i}}</td>
+               <td>{{_i}}false{{/i}}</td>
+               <td>
+                <p>{{_i}}Appends the tooltip to a specific element <code>container: 'body'</code>{{/i}}</p>
+               </td>
+             </tr>
             </tbody>
           </table>
           <div class="alert alert-info">
@@ -788,7 +796,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 
           <h3>{{_i}}Markup{{/i}}</h3>
           <p>{{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.{{/i}}</p>
-          <pre class="prettyprint linenums">&lt;a href="#" rel="tooltip" title="{{_i}}first tooltip{{/i}}"&gt;{{_i}}hover over me{{/i}}&lt;/a&gt;</pre>
+          <pre class="prettyprint linenums">&lt;a href="#" data-toggle="tooltip" title="{{_i}}first tooltip{{/i}}"&gt;{{_i}}hover over me{{/i}}&lt;/a&gt;</pre>
 
           <h3>{{_i}}Methods{{/i}}</h3>
           <h4>$().tooltip({{_i}}options{{/i}})</h4>
@@ -860,16 +868,16 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
 
         <h3>Live demo</h3>
         <div class="bs-docs-example" style="padding-bottom: 24px;">
-          <a href="#" class="btn btn-large btn-danger" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">{{_i}}Click to toggle popover{{/i}}</a>
+          <a href="#" class="btn btn-large btn-danger" data-toggle="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">{{_i}}Click to toggle popover{{/i}}</a>
         </div>
 
         <h4>{{_i}}Four directions{{/i}}</h4>
         <div class="bs-docs-example tooltip-demo">
           <ul class="bs-docs-tooltip-examples">
-            <li><a href="#" class="btn" rel="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on top">Popover on top</a></li>
-            <li><a href="#" class="btn" rel="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on right">Popover on right</a></li>
-            <li><a href="#" class="btn" rel="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on bottom">Popover on bottom</a></li>
-            <li><a href="#" class="btn" rel="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on left">Popover on left</a></li>
+            <li><a href="#" class="btn" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on top">Popover on top</a></li>
+            <li><a href="#" class="btn" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on right">Popover on right</a></li>
+            <li><a href="#" class="btn" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on bottom">Popover on bottom</a></li>
+            <li><a href="#" class="btn" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on left">Popover on left</a></li>
           </ul>
         </div>{{! /example }}
 
@@ -907,7 +915,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
            </tr>
            <tr>
              <td>{{_i}}placement{{/i}}</td>
-             <td>{{_i}}string|function{{/i}}</td>
+             <td>{{_i}}string | function{{/i}}</td>
              <td>'right'</td>
              <td>{{_i}}how to position the popover{{/i}} - top | bottom | left | right</td>
            </tr>
@@ -1353,9 +1361,9 @@ $('#myCollapsible').on('hidden', function () {
             <div class="bs-docs-example">
               <div id="myCarousel" class="carousel slide">
                 <ol class="carousel-indicators">
-                  <li class="active"></li>
-                  <li></li>
-                  <li></li>
+                  <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+                  <li data-target="#myCarousel" data-slide-to="1"></li>
+                  <li data-target="#myCarousel" data-slide-to="2"></li>
                 </ol>
                 <div class="carousel-inner">
                   <div class="item active">
@@ -1386,6 +1394,11 @@ $('#myCollapsible').on('hidden', function () {
             </div>{{! /example }}
 <pre class="prettyprint linenums">
 &lt;div id="myCarousel" class="carousel slide"&gt;
+  &lt;ol class="carousel-indicators"&gt
+    &lt;li data-target="#myCarousel" data-slide-to="0" class="active"&gt&lt;/li&gt
+    &lt;li data-target="#myCarousel" data-slide-to="1"&gt&lt;/li&gt
+    &lt;li data-target="#myCarousel" data-slide-to="2"&gt&lt;/li&gt
+  &lt;/ol&gt
   &lt;!-- {{_i}}Carousel items{{/i}} --&gt;
   &lt;div class="carousel-inner"&gt;
     &lt;div class="active item"&gt;…&lt;/div&gt;
@@ -1410,14 +1423,14 @@ $('#myCollapsible').on('hidden', function () {
             <h2>{{_i}}Usage{{/i}}</h2>
 
             <h3>{{_i}}Via data attributes{{/i}}</h3>
-            <p>{{_i}}...{{/i}}</p>
+            <p>{{_i}}Use data attributes to easily control the position of the carousel. <code>data-slide</code> accepts the keywords <code>prev</code> or <code>next</code>, which alters the slide position relative to it's current position. Alternatively, use <code>data-slide-to</code> to pass a raw slide index to the carousel <code>data-slide-to="2"</code>, which jump's the slide position to a particular index beginning with <code>0</code>.{{/i}}</p>
 
             <h3>{{_i}}Via JavaScript{{/i}}</h3>
             <p>{{_i}}Call carousel manually with:{{/i}}</p>
             <pre class="prettyprint linenums">$('.carousel').carousel()</pre>
 
             <h3>{{_i}}Options{{/i}}</h3>
-            <p>{{_i}}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>.{{/i}}</p>
+            <p>{{_i}}Options can be passed via data attributes or JavaScriptz. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.{{/i}}</p>
             <table class="table table-bordered table-striped">
               <thead>
                <tr>