diff --git a/javascript.html b/javascript.html
index 4d3d08800b3e9824e6db2253ea01823c39b3337a..4c6f930b710cb398ca99eb8932cd74340a2d4fc6 100644
--- a/javascript.html
+++ b/javascript.html
@@ -1757,7 +1757,7 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
     <h3>Via data attributes</h3>
     <p>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 its 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 shifts the slide position to a particular index beginning with <code>0</code>.</p>
     <p>The <code>data-ride="carousel"</code> attribute is used to mark a carousel as animating starting at page load.</p>
-
+    <p>The <code>data-random="true"</code> attribute has the carousel choose a random starting item from the set of items.</p>
     <h3>Via JavaScript</h3>
     <p>Call carousel manually with:</p>
 {% highlight js %}
diff --git a/js/carousel.js b/js/carousel.js
index d8c4c243caa153204bfa6447c8731bec63422dda..b2a8e011fe81a4f823ec3e7d9c3551f295fa0395 100644
--- a/js/carousel.js
+++ b/js/carousel.js
@@ -173,6 +173,13 @@
       if (typeof option == 'number') data.to(option)
       else if (action) data[action]()
       else if (options.interval) data.pause().cycle()
+
+      if (options.random) {
+        $this.find('.item.active').removeClass('active')
+        var $items = $this.find('.item')
+        var pos = Math.floor(Math.random() * $items.length)
+        $($items[pos]).addClass('active')
+      }
     })
   }