Team:Sevilla/components
From 2011.igem.org
(Difference between revisions)
Line 2: | Line 2: | ||
<html> | <html> | ||
+ | |||
+ | <!--===================================FOTOS================================================--> | ||
+ | |||
+ | <div class="ejemplo_img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2011/5/51/ArcPablo.png" width="190" height="200" /> | ||
+ | <div class="ejemplo_img_cont"> | ||
+ | <p style="text-align:center">Pablo</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="ejemplo_img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2011/2/20/ArcRoberto.png" width="190" height="200" /> | ||
+ | <div class="ejemplo_img_cont"> | ||
+ | <p style="text-align:center">Roberto</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="ejemplo_img"> | ||
+ | <img src="https://static.igem.org/mediawiki/2011/0/0e/ArcElena.png" width="190" height="200" /> | ||
+ | <div class="ejemplo_img_cont"> | ||
+ | <p style="text-align:center">Elena</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function(){ | ||
+ | $(".ejemplo_img").mouseenter(function() { | ||
+ | $(".ejemplo_img_cont", this).stop().animate({ top:'160px' },{ queue:false, duration:300 }); | ||
+ | }); | ||
+ | $(".ejemplo_img").mouseleave(function() { | ||
+ | $(".ejemplo_img_cont", this).stop().animate({ top:'200px' },{ queue:false, duration:300 }); | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | <style> | ||
+ | .ejemplo_img { | ||
+ | position:relative; | ||
+ | float:left; | ||
+ | width:190px; | ||
+ | height:200px; | ||
+ | border:2px inset #333; | ||
+ | overflow:hidden; | ||
+ | margin-left:2px; | ||
+ | } | ||
+ | |||
+ | .ejemplo_img_cont { | ||
+ | float:left; | ||
+ | position:absolute; | ||
+ | background:#000; | ||
+ | height:60px; | ||
+ | line-height:25px; | ||
+ | width:190px; | ||
+ | padding:2px; | ||
+ | opacity:.8; | ||
+ | filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80); | ||
+ | -MS-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; | ||
+ | top:200px; | ||
+ | left:0px; | ||
+ | color:#FFF; | ||
+ | font-size:18px; | ||
+ | font-family:"Lucida Grande", Arial, sans-serif; | ||
+ | z-index:10; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
<!--===================================GRAFICA QUESITOS================================================--> | <!--===================================GRAFICA QUESITOS================================================--> | ||
Revision as of 16:30, 14 June 2011
Pablo
Roberto
Elena