Team:Imperial College/Templates/Slideshow

From 2013.igem.org

(Difference between revisions)
(Created page with "<noinclude> This is a template for a slideshow. It's still under construction, but when finished there will be instructions on how to use it here. </noinclude> {{{test}}} <html> ...")
m
Line 1: Line 1:
<noinclude>
<noinclude>
This is a template for a slideshow. It's still under construction, but when finished there will be instructions on how to use it here.
This is a template for a slideshow. It's still under construction, but when finished there will be instructions on how to use it here.
 +
</noinclude>
</noinclude>
-
{{{test}}}
 
<html>
<html>
-
<div class="jcarousel-container">
 
-
  <div class="jcarousel">
 
-
    <div class="jcarousel-slides">
 
-
      <div class="jcarousel-slide">
 
-
        <div class="jcarousel-pic"><iframe width="550" height="400" src="//www.youtube.com/embed/RfiQYRn7fBg?rel=0" frameborder="0" allowfullscreen></iframe></div>
 
-
        <div class="jcarousel-caption">Put text here</div>
 
-
      </div>   
 
-
      <div class="jcarousel-slide">
 
-
        <div class="jcarousel-pic"><img src="https://static.igem.org/mediawiki/2013/4/44/Mountains4.png" style="width: 400px;"></div>
 
-
        <div class="jcarousel-caption">Europe's Newest Mountain, Mount Wasted</div>
 
-
      </div>
 
-
      <div class="jcarousel-slide">
 
-
        <div class="jcarousel-pic"><iframe width="550" height="400" src="//www.youtube.com/embed/RfiQYRn7fBg?rel=0" frameborder="0" allowfullscreen></iframe></div>
 
-
        <div class="jcarousel-caption">Put text here</div>
 
-
      </div>
 
-
    </div>
 
-
  </div>
 
-
  <div class="jcarousel-prev" onclick="$('.jcarousel').jcarousel('scroll', '-=1');"><</div>
 
-
  <div class="jcarousel-next" onclick="$('.jcarousel').jcarousel('scroll', '+=1');">></div>
 
-
</div>
 
-
 
<style type="text/css">
<style type="text/css">
.jcarousel-container {
.jcarousel-container {
     position: relative;
     position: relative;
-
    border:1px solid black;
 
     padding: 20px 40px;
     padding: 20px 40px;
     width: 600px;
     width: 600px;
Line 36: Line 14:
     position: relative;
     position: relative;
     overflow: hidden;
     overflow: hidden;
-
    border:1px solid red;
 
     /* You need at least a height, adjust this to your needs */
     /* You need at least a height, adjust this to your needs */
     height: 500px;
     height: 500px;
Line 52: Line 29:
     float: left;
     float: left;
     width: 600px;
     width: 600px;
-
}
 
-
.jcarousel-pic{
 
-
}
 
-
.jcarousel-caption{
 
}
}

Revision as of 22:46, 25 August 2013

This is a template for a slideshow. It's still under construction, but when finished there will be instructions on how to use it here.


Retrieved from "http://2013.igem.org/Team:Imperial_College/Templates/Slideshow"