html - Bootstrap Carousel not working correctly -
this time it's carousel giving me trouble. should normal don't know why isn't working. saw in site, in here: http://parkhurstdesign.com/improved-carousels-twitter-bootstrap/
here's codeply link: http://www.codeply.com/go/ypbxy1hmc8 , here html/css code:
<!-- wrap page content here --> <div id="wrap"> <!-- fixed navbar --> <div class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">sugoi!</a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="anime"><a href="#anime">anime</a></li> <li class="manga"><a href="#manga">manga</a></li> <li class="jogos"><a href="#jogos">jogos</a></li> <li class="opiniao"><a href="#opiniao">opiniĆ£o</a></li> <li class="outros"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">outros <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">amv</a></li> <li><a href="#">cosplay</a></li> <li><a href="#">passatempos</a></li> </ul> </li></ul> <ul class="pull-right nav navbar-nav"> <li><a href="#about">sobre</a></li> <li><a href="#contact">contacto</a></li> </ul> </div> </div> </div> <!-- begin page content --> <div class="container"> <div class="page-header"> <h1>sugoi!</h1> </div> <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> <li data-target="#mycarousel" data-slide-to="1"></li> <li data-target="#mycarousel" data-slide-to="2"></li> <li data-target="#mycarousel" data-slide-to="3"></li> </ol> <!-- wrapper slides --> <div class="carousel-inner" role="listbox"> <div class="item active"> <div style="background:url(http://imageslgmr.lazygamer.netdna-cdn.com/2014/11/naruto.jpg) center center; background-size:cover;" class="slider-size"> <div class="carousel-caption"> <a href="anime_1.com"><h3>anime_1</h3> <p>narutonaruto</p></a> </div> </div> <div class="item"> <div style="background:url(http://images.akamai.steamusercontent.com/ugc/39731145643729554/aa0dfb3ddc16c2d344721953b646a8279aebba76/) center center; background-size:cover;" class="slider-size"> <div class="carousel-caption"> <a href="anime_2.com"><h3>anime_2</h3> <p>jojo</p></a> </div> </div> <div class="item"> <div style="background:url(https://encrypted-tbn0.gstatic.com/images?q=tbn:and9gctswp_yyk55jax9g7r9pzqvertnognwpxctdbpzhgiocvtta_af) center center; background-size:cover;" class="slider-size"> <div class="carousel-caption"> <a href="anime_3.com"><h3>anime_3</h3> <p>one outs oneouts</p></a> </div> </div> <div class="item"> <div style="background:url(http://images7.alphacoders.com/302/302762.jpg) center center; background-size:cover;" class="slider-size"> <div class="carousel-caption"> <a href="anime_4.com"><h3>anime_4</h3> <p>p3p3p3p3p3</p></a> </div> </div> </div> <!-- left , right controls --> <a class="left carousel-control" href="#mycarousel" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">previous</span> </a> <a class="right carousel-control" href="#mycarousel" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">next</span> </a> </div> <!-- content--> <div class="container"> <p class="lead">pin fixed-height footer bottom of viewport in desktop browsers custom html , css. fixed navbar has been added within <code>#wrap</code> <code>padding-top: 60px;</code> on <code>.container</code>.</p> <p>testeststeststststestset</p> <p>jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkmae jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkmajafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma jafhjaekfjeankjfebajfnkeajnandnaunf eafnbuaenfka nf ankv anm fakf aov ma vkja nv adjk vkmsd knv sj kma voa vkma</p> <p class="lead">...</p> <p>back <a href="../sticky-footer">the default sticky footer</a> minus navbar.</p> </div> <!--footer--> <div id="footer"> <div class="container"> <p class="text-muted credit">example courtesy <a href="http://martinbean.co.uk">martin bean</a> , <a href="http://ryanfait.com/sticky-footer/">ryan fait</a>.</p> </div> </div> </div>
css
/* sticky footer styles -------------------------------------------------- */ html, body { height: 100%; overflow: auto; /* html , body elements cannot have padding or margin. */ } /* wrapper page content push down footer */ #wrap { min-height: 100%; height: auto !important; height: 100%; /* negative indent footer height */ margin: 0 auto -60px; /* pad bottom footer height */ padding: 0 0 60px; } /* set fixed height of footer here */ #footer { height: 60px; background-color: #f5f5f5; } /* custom page css -------------------------------------------------- */ /* not required template or sticky footer method. */ #wrap > .container { padding: 60px 15px 0; } .container .credit { margin: 20px 0; } #footer > .container { padding-left: 15px; padding-right: 15px; } code { font-size: 80%; } .slider-size { height: 400px; /* slider height */ } .carousel { width:100%; margin:0 auto; /* center carousel if other 100% */ }
you're missing closing </div>
tags inside of <div class="carousel-inner" role="listbox">
Comments
Post a Comment