Team:UFMG Brazil/css3test

From 2013.igem.org

(Difference between revisions)
 
(3 intermediate revisions not shown)
Line 3: Line 3:
<style>
<style>
-
p#cf7_controls {
+
#cf {
-
  text-align:center;
+
-
}
+
-
 
+
-
#cf7_controls span {
+
-
  padding-right:2em;
+
-
  cursor:pointer;
+
-
}
+
-
 
+
-
#cf7 {
+
   position:relative;
   position:relative;
-
   height:433px;
+
   height:790px;
-
   width:790px;
+
   width:433px;
-
   margin:0 auto 10px;
+
   margin:0 auto;
}
}
-
#cf7 img {
+
#cf img {
   position:absolute;
   position:absolute;
   left:0;
   left:0;
Line 26: Line 17:
   -o-transition: opacity 1s ease-in-out;
   -o-transition: opacity 1s ease-in-out;
   transition: opacity 1s ease-in-out;
   transition: opacity 1s ease-in-out;
-
  opacity:0;
 
-
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 
-
  filter: alpha(opacity=0);
 
}
}
-
#cf7 img.opaque {
+
#cf img.top:hover {
-
   opacity:1;
+
   opacity:0;
-
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+
-
  filter: alpha(opacity=1);
+
}
}
</style>
</style>
-
<script type=text/javascript>
+
<center><div id="cf">
-
$(document).ready(function() {
+
   <img class="bottom" src="https://static.igem.org/mediawiki/2013/3/3e/Ufmg_2013_ilustra0.jpg" />
-
  $("#cf7_controls").on('click', 'span', function() {
+
   <img class="https://static.igem.org/mediawiki/2013/2/22/Ufmg_2013_ilustra1.jpg" />
-
    $("#cf7 img").removeClass("opaque");
+
</div></center>
-
 
+
-
    var newImage = $(this).index();
+
-
 
+
-
    $("#cf7 img").eq(newImage).addClass("opaque");
+
-
 
+
-
    $("#cf7_controls span").removeClass("selected");
+
-
    $(this).addClass("selected");
+
-
  });
+
-
});
+
-
</script>
+
-
 
+
-
<div id="cf7" class="shadow">
+
-
   <img class='opaque' src="https://static.igem.org/mediawiki/2013/3/3e/Ufmg_2013_ilustra0.jpg" />
+
-
   <img src="https://static.igem.org/mediawiki/2013/2/22/Ufmg_2013_ilustra1.jpg" />
+
-
  <img src="https://static.igem.org/mediawiki/2013/2/2e/Ufmg_2013_ilustra2.jpg" />
+
-
  <img src="https://static.igem.org/mediawiki/2013/0/09/Ufmg_2013_ilustra3.jpg" />
+
-
</div>
+
-
<p id="cf7_controls">
+
-
  <span class="selected">Image 1</span>
+
-
  <span>Image 2</span>
+
-
  <span>Image 3</span>
+
-
  <span>Image 4</span>
+
-
</p>
+
</html>
</html>
{{Team:UFMG Brazil/sponsor}}
{{Team:UFMG Brazil/sponsor}}

Latest revision as of 21:37, 27 September 2013

Our Sponsors

Reitoria-de-pesquisa-UFMG.jpg Reitoria-de-posgraduacao-UFMG.jpg Icb ufmg.jpg Bioquimica.jpg Bioinformatica.jpg INCT.jpg Inctv.jpg Nanobiofar.jpg Fapemig.jpg Sintesebiotecnologia.jpg

Retrieved from "http://2013.igem.org/Team:UFMG_Brazil/css3test"