Team:Potsdam Bioware/slider

From 2012.igem.org

(Difference between revisions)
 
(53 intermediate revisions not shown)
Line 1: Line 1:
 +
{{:Team:Potsdam_Bioware/slider/javascript}}
<html>
<html>
Line 6: Line 7:
#slider {
#slider {
 +
        border-radius: 5px;
margin: 0px auto;
margin: 0px auto;
-
width: 845px;
+
width: 975px;
-
height: 200px;
+
height: 340px;
position: relative;
position: relative;
overflow: hidden;
overflow: hidden;
background: #434343;
background: #434343;
-
}
 
-
 
-
#slider [id^='image']:target img {
 
-
top: 0; 
 
-
left: 0;
 
}
}
Line 26: Line 23:
}
}
-
#slider [id^="image"] img {
+
#slider [id^="image"] div{
position: absolute;
position: absolute;
-
top: -200px;
+
left: 2000px;
border: 0;
border: 0;
-
-moz-transition: top 0.5s ease-in;
+
-moz-transition: 0.5s ease-in;
-
-ms-transition: top 0.5s ease-in;
+
-ms-transition: 0.5s ease-in;
-
-webkit-transition: top 0.5s ease-in;
+
-webkit-transition: 0.5s ease-in;
-
-o-transition: top 0.5s ease-in;
+
-o-transition: 0.5s ease-in;
}
}
-
#slider [id^="image"] p{
+
#slider [id^='image']:target div{
-
position: absolute;
+
bottom: 0;
-
top: -200px;
+
left: 0;
-
border: 0;
+
-
-moz-transition: top 0.5s ease-in;
+
-
-ms-transition: top 0.5s ease-in;
+
-
-webkit-transition: top 0.5s ease-in;
+
-
-o-transition: top 0.5s ease-in;
+
}
}
Line 57: Line 49:
}
}
-
#image-1 .slider-nav {
 
-
right: 80px;
 
-
}
 
#image-2 .slider-nav {
#image-2 .slider-nav {
-
right: 60px;
+
right: 140px;
}
}
#image-3 .slider-nav {
#image-3 .slider-nav {
-
right: 40px;
+
right: 120px;
}
}
#image-4 .slider-nav {
#image-4 .slider-nav {
 +
right: 100px;
 +
}
 +
#image-5 .slider-nav {
 +
right: 80px;
 +
}
 +
#image-6 .slider-nav {
 +
right: 60px;
 +
}
 +
#image-7 .slider-nav {
 +
right: 40px;
 +
}
 +
#image-8 .slider-nav {
right: 20px;
right: 20px;
}
}
-
 
 +
div.image_description{ 
 +
    position:absolute;
 +
    top:50 px;
 +
    bottom: 0 px;
 +
    height: 40px;
 +
    left:0px; 
 +
    width:100%; 
 +
 +
    background-color:black; 
 +
    font-family: 'tahoma'; 
 +
    font-size:15px; 
 +
    color:white; 
 +
    opacity:0.6;
 +
    filter:alpha(opacity=60);
 +
 +
p.image_description_content{ 
 +
    padding:10px; 
 +
    margin:0px;
 +
 +
 +
div.slider_wrapper {
 +
  float:left;
 +
  position:relative;
 +
  top: 0;
 +
}
</style>
</style>
-
<script type="text/javascript">window.location.hash = '#image-1'</script>
+
<script type="text/javascript">
 +
$(document).ready(function() {
 +
  window.location.hash = '#image-2'
 +
})
 +
</script>
</head>
</head>
<div id="slider">
<div id="slider">
-
<div id="image-1">
+
 
-
<a href=""><img src="https://static.igem.org/mediawiki/2012/3/3e/UP12June.jpg"/></a>
+
 
-
<a class="slider-nav" href="#image-1"></a>
+
-
</div>
+
<div id="image-2">
<div id="image-2">
-
<a href=""><img src="https://static.igem.org/mediawiki/2012/2/24/UP12July.jpg"/></a>
+
            <div class="slider_wrapper">
-
<a class="slider-nav" href="#image-2"></a>
+
                <img src="https://static.igem.org/mediawiki/2012/2/28/UP12_Slide1.jpg"/>
 +
                            </div>
 +
            <a class="slider-nav" href="#image-2"></a>
</div>
</div>
<div id="image-3">
<div id="image-3">
-
<p>even more</p>
+
                <div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/5/52/UP12_slide2.jpg"/>
 +
                              </div>
<a class="slider-nav" href="#image-3"></a>
<a class="slider-nav" href="#image-3"></a>
</div>
</div>
<div id="image-4">
<div id="image-4">
-
<p>the last</p>
+
<div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/5/57/UP12Slide3.jpg"/>
 +
                <div class="image_description">
 +
                    <p class="image_description_content">
 +
                      <b>Antibody module: In the first step, an antibody gene is integrated into the genome of CHO cells.</b>
 +
                    </p>
 +
                </div>
 +
                </div>
<a class="slider-nav" href="#image-4"></a>
<a class="slider-nav" href="#image-4"></a>
</div>
</div>
 +
<div id="image-5">
 +
<div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/8/87/UP12Slide4.jpg"/>
 +
                <div class="image_description">
 +
                    <p class="image_description_content">
 +
                      <b>Antibody module: The CHO cell expresses the antibody on the cell surface.</b>
 +
                    </p>
 +
                </div>
 +
                </div>
 +
<a class="slider-nav" href="#image-5"></a>
 +
</div>
 +
<div id="image-6">
 +
<div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/f/f0/UP12Slide5.jpg"/>
 +
                <div class="image_description">
 +
                    <p class="image_description_content">
 +
                    <b>Mutation module: The enzyme AID mutates the antibody gene -> maturation</b> 
 +
                    </p>
 +
                </div>
 +
                </div>
 +
<a class="slider-nav" href="#image-6"></a>
 +
</div>
 +
<div id="image-7">
 +
<div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/7/79/UP12slide7.jpg"/>
 +
                <div class="image_description">
 +
                    <p class="image_description_content">
 +
                      <b>Selection Module: A virus infects cells with high affine antibodies. These cells survive. </b>
 +
                    </p>
 +
                </div>
 +
                </div>
 +
<a class="slider-nav" href="#image-7"></a>
 +
</div>
 +
<div id="image-8">
 +
<div class="slider_wrapper">
 +
                <img src="https://static.igem.org/mediawiki/2012/9/92/UP12slide8.jpg"/>
 +
                <div class="image_description">
 +
                    <p class="image_description_content">
 +
                      <b>The selected cells are switched to antibody secreting cells with Cre-recombinase.</b>
 +
                    </p>
 +
                </div>
 +
                </div>
 +
<a class="slider-nav" href="#image-8"></a>
 +
</div>
 +
 +
</div>
</div>
</html>
</html>

Latest revision as of 21:51, 26 September 2012

Antibody module: In the first step, an antibody gene is integrated into the genome of CHO cells.

Antibody module: The CHO cell expresses the antibody on the cell surface.

Mutation module: The enzyme AID mutates the antibody gene -> maturation

Selection Module: A virus infects cells with high affine antibodies. These cells survive.

The selected cells are switched to antibody secreting cells with Cre-recombinase.