javascript - Carousel asp.net mvc -

i new asp.net mvc, today tried install new bootstrap them , got stuff working except carousel not showing.

this bundle class:

public static void registerbundles(bundlecollection bundles)     {         bundles.add(new scriptbundle("~/bundles/jquery").include(                     "~/scripts/jquery-{version}.js"));          bundles.add(new scriptbundle("~/bundles/jqueryval").include(                     "~/scripts/jquery.validate*"));          // use development version of modernizr develop , learn from. then, when you're         // ready production, use build tool @ http://modernizr.com pick tests need.         bundles.add(new scriptbundle("~/bundles/modernizr").include(                     "~/scripts/modernizr-*"));          bundles.add(new scriptbundle("~/bundles/bootstrap").include(                   "~/scripts/bootstrap.js",                   "~/scripts/respond.js"));           //bundles.add(new stylebundle("~/content/css").include(         //          "~/content/bootstrap.css",         //          "~/content/site.css"));         bundles.add(new stylebundle("~/content/css").include(              "~/content/bootstrap.css",              "~/content/modern-bussiness.css",                 "~/content/site.css"));      } } 

and index

<header id="mycarousel" class="carousel slide">     <!-- indicators -->     <ol class="carousel-indicators">         <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>      <!-- wrapper slides -->     <div class="carousel-inner">         <div class="item active">             <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=slide one');"></div>             <div class="carousel-caption">                 <h2>caption 1</h2>             </div>         </div>         <div class="item">             <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=slide two');"></div>             <div class="carousel-caption">                 <h2>caption 2</h2>             </div>         </div>         <div class="item">             <div class="fill" style="background-image:url('http://placehold.it/1900x1080&text=slide three');"></div>             <div class="carousel-caption">                 <h2>caption 3</h2>             </div>         </div>     </div>      <!-- controls -->     <a class="left carousel-control" href="#mycarousel" data-slide="prev">         <span class="icon-prev"></span>     </a>     <a class="right carousel-control" href="#mycarousel" data-slide="next">         <span class="icon-next"></span>     </a> </header> 

and function:

<script> $('.carousel').carousel({     interval: 5000 //changes speed }) </script> 

is 1 there help.

from docs jcarrousel

you need add

bundles.add(new scriptbundle("~/bundles/jcarrousel").include(                 "~/path/to/jquery.jcarousel.js"));