use data-ride="carousel" in the docs & examples; fixes #11005

diff --git a/docs-assets/js/application.js b/docs-assets/js/application.js
index 76c24e5a6904310c15a30a6333ab13d5c2417a01..44b2e12ad29dc984e24b065fe1ed2fdc47bd0014 100644 (file)
--- a/docs-assets/js/application.js
+++ b/docs-assets/js/application.js
@@ -90,9 +90,6 @@
           btn.button('reset')
         }, 3000)
       })
-
-    // carousel demo
-    $('.bs-docs-carousel-example').carousel()
 })
 
 }(window.jQuery)

diff --git a/examples/carousel/index.html b/examples/carousel/index.html
index a57cab7452311324611201d507d7a40dbdb353d3..c9a99cbd6495ccd1cf037ae120a6d35ff7fad137 100644 (file)
--- a/examples/carousel/index.html
+++ b/examples/carousel/index.html
@@ -66,7 +66,7 @@
 
     <!-- Carousel
     ================================================== -->
-    <div id="myCarousel" class="carousel slide">
+    <div id="myCarousel" class="carousel slide" data-ride="carousel">
       <!-- Indicators -->
       <ol class="carousel-indicators">
         <li data-target="#myCarousel" data-slide-to="0" class="active"></li>

diff --git a/javascript.html b/javascript.html
index 67cc9779f05244a7cf30aad3dc50523f71ce7d38..5eb742cd24d068106647c8577846bf771d8cac9c 100644 (file)
--- a/javascript.html
+++ b/javascript.html
@@ -1665,7 +1665,7 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
     <h2 id="carousel-examples">Examples</h2>
     <p>The slideshow below shows a generic plugin and component for cycling through elements like a carousel.</p>
     <div class="bs-example">
-      <div id="carousel-example-generic" class="carousel slide bs-docs-carousel-example">
+      <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
         <ol class="carousel-indicators">
           <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
           <li data-target="#carousel-example-generic" data-slide-to="1"></li>
@@ -1691,7 +1691,7 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
       </div>
     </div><!-- /example -->
 {% highlight html %}
-<div id="carousel-example-generic" class="carousel slide">
+<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
   <!-- Indicators -->
   <ol class="carousel-indicators">
     <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
@@ -1727,7 +1727,7 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
     <h3>Optional captions</h3>
     <p>Add captions to your slides easily with the <code>.carousel-caption</code> element within any <code>.item</code>. Place just about any optional HTML within there and it will be automatically aligned and formatted.</p>
     <div class="bs-example">
-      <div id="carousel-example-captions" class="carousel slide bs-docs-carousel-example">
+      <div id="carousel-example-captions" class="carousel slide" data-ride="carousel">
         <ol class="carousel-indicators">
           <li data-target="#carousel-example-captions" data-slide-to="0" class="active"></li>
           <li data-target="#carousel-example-captions" data-slide-to="1"></li>