Team:Imperial College/Templates:carousel
From 2013.igem.org
(Difference between revisions)
Neilthomson (Talk | contribs) (Created page with "<html> <div id="myCarousel" class="carousel slide"> <ol class="carousel-indicators"> <li data-target="#myCarousel" data-slide-to="0" class="active"></li> <li data-targ...") |
Neilthomson (Talk | contribs) |
||
(One intermediate revision not shown) | |||
Line 2: | Line 2: | ||
<div id="myCarousel" class="carousel slide"> | <div id="myCarousel" class="carousel slide"> | ||
- | + | <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> | |
+ | |||
<!-- Carousel items --> | <!-- Carousel items --> | ||
- | + | <div class="carousel-inner"> | |
- | + | ||
- | + | <div class="active item"> | |
- | + | <img src="https://static.igem.org/mediawiki/2013/4/44/Mountains4.png"> | |
- | + | <div class="carousel-caption"> | |
- | + | <h4>Europe's Newest Mountain, Mount Wasted</h4> | |
- | + | <p></p> | |
- | + | </div> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
</div> | </div> | ||
+ | |||
+ | <div class="item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/f/f8/Very_stressed_ecoli.jpg"> | ||
+ | <div class="carousel-caption"> | ||
+ | <h4>Stressed Ecoli</h4> | ||
+ | <p>Production of the red pigment by stress induction. MG1655 were grown with LB media and sterile filtrated WCM for 48 hours.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="item"> | ||
+ | <img src="https://static.igem.org/mediawiki/2013/0/0e/Jar_of_SRF.jpg"> | ||
+ | <div class="carousel-caption"> | ||
+ | <h4>Solid Recovered Fuel (SRF)</h4> | ||
+ | <p></p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
</div> | </div> | ||
- | + | ||
- | + | <!-- Carousel nav --> | |
- | + | <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a> | |
- | + | <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
</div> | </div> | ||
<script> | <script> | ||
- | $(' | + | $('#myCarousel').carousel(); |
</script> | </script> | ||
</html> | </html> |
Latest revision as of 23:11, 11 September 2013