Team:Potsdam Bioware/slider

From 2012.igem.org

(Difference between revisions)
 
(28 intermediate revisions not shown)
Line 10: Line 10:
margin: 0px auto;
margin: 0px auto;
width: 975px;
width: 975px;
-
height: 300px;
+
height: 340px;
position: relative;
position: relative;
overflow: hidden;
overflow: hidden;
Line 25: Line 25:
#slider [id^="image"] div{
#slider [id^="image"] div{
position: absolute;
position: absolute;
-
top: -800px;
+
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']:target div{
#slider [id^='image']:target div{
-
top: 0;   
+
bottom: 0;   
left: 0;
left: 0;
}
}
Line 49: Line 49:
}
}
-
#image-1 .slider-nav {
 
-
right: 100px;
 
-
}
 
#image-2 .slider-nav {
#image-2 .slider-nav {
-
right: 80px;
+
right: 140px;
}
}
#image-3 .slider-nav {
#image-3 .slider-nav {
-
right: 60px;
+
right: 120px;
}
}
#image-4 .slider-nav {
#image-4 .slider-nav {
-
right: 40px;
+
right: 100px;
}
}
#image-5 .slider-nav {
#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;
}
}
 +
-
.trans_white_box {
+
div.image_description{
-
  width: 300px;
+
    position:absolute;  
-
  height: 100px;
+
    top:50 px;
-
  border-radius: 5px;
+
    bottom: 0 px;
-
  background-color : white;
+
    height: 40px;
-
  opacity:0.4;
+
    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">
+
 
-
                <div>
+
 
 +
<div id="image-2">
 +
            <div class="slider_wrapper">
                 <img src="https://static.igem.org/mediawiki/2012/2/28/UP12_Slide1.jpg"/>
                 <img src="https://static.igem.org/mediawiki/2012/2/28/UP12_Slide1.jpg"/>
-
                </div>
+
                            </div>
-
<a class="slider-nav" href="#image-1"></a>
+
            <a class="slider-nav" href="#image-2"></a>
-
</div>
+
-
<div id="image-2">
+
-
                <div>
+
-
                <img src="https://static.igem.org/mediawiki/2012/5/52/UP12_slide2.jpg"/>
+
-
                </div>
+
-
<a class="slider-nav" href="#image-2"></a>
+
</div>
</div>
<div id="image-3">
<div id="image-3">
-
<div>
+
                <div class="slider_wrapper">
-
                 <img src="https://static.igem.org/mediawiki/2012/5/57/UP12Slide3.jpg"/>
+
                 <img src="https://static.igem.org/mediawiki/2012/5/52/UP12_slide2.jpg"/>
-
                </div>
+
                              </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">
-
<div>
+
<div class="slider_wrapper">
-
                 <img src="https://static.igem.org/mediawiki/2012/8/87/UP12Slide4.jpg"/>
+
                 <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>
                 </div>
<a class="slider-nav" href="#image-4"></a>
<a class="slider-nav" href="#image-4"></a>
</div>
</div>
<div id="image-5">
<div id="image-5">
-
<div>
+
<div class="slider_wrapper">
-
                 <img src="https://static.igem.org/mediawiki/2012/f/f0/UP12Slide5.jpg"/>
+
                 <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>
                 </div>
<a class="slider-nav" href="#image-5"></a>
<a class="slider-nav" href="#image-5"></a>
</div>
</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.