Team:UNAM-Genomics Mexico/Templates/Sliderbiosintetizarte
From 2011.igem.org
(Difference between revisions)
(Created page with "<!-- @VERSION 3.0 @NAME General Template header 2 --> <html> <head> <style type="text/css"> - →Horizontal Slider: .top-slider-main{width:860px; height:459px; overflow:hidd...") |
|||
(20 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | {{:Team:UNAM-Genomics Mexico/Templates/Menu}} | ||
+ | |||
<!-- | <!-- | ||
@VERSION 3.0 | @VERSION 3.0 | ||
Line 5: | Line 7: | ||
<html> | <html> | ||
<head> | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> | ||
+ | <link href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Templates/Home" rel="stylesheet" type="text/css" /> | ||
+ | <title>UNAM-Genomics_Mexico</title> | ||
+ | <script type="text/javascript"> | ||
- | + | var _gaq = _gaq || []; | |
+ | _gaq.push(['_setAccount', 'UA-19624614-2']); | ||
+ | _gaq.push(['_trackPageview']); | ||
+ | (function() { | ||
+ | var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | ||
+ | ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; | ||
+ | var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); | ||
+ | })(); | ||
+ | |||
+ | </script> | ||
+ | |||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> | ||
+ | |||
+ | |||
+ | |||
+ | <style type="text/css"> | ||
/*Horizontal Slider*/ | /*Horizontal Slider*/ | ||
- | .top-slider-main{width:860px; height: | + | .top-slider-main{width:860px; height:358px; overflow:hidden; position:relative; border:0px solid #000; background: #ff8888; |
-webkit-box-shadow: 5px 5px 8px #818181; | -webkit-box-shadow: 5px 5px 8px #818181; | ||
-moz-box-shadow: 5px 5px 8px #818181; | -moz-box-shadow: 5px 5px 8px #818181; | ||
} | } | ||
- | .top-slider-main div{width:610px; height: | + | .top-slider-main div{width:610px; height:358px; position:absolute; background-color:#FFF; } |
.top-slider-main .slider-box1{z-index:95;} | .top-slider-main .slider-box1{z-index:95;} | ||
.top-slider-main .slider-box2{margin-left:610px; z-index:96;} | .top-slider-main .slider-box2{margin-left:610px; z-index:96;} | ||
Line 52: | Line 73: | ||
} | } | ||
+ | |||
+ | /* CHANGING THE WIKI CSS */ | ||
+ | |||
+ | #content { | ||
+ | position: relative; | ||
+ | width: 976px; | ||
+ | margin: 0 auto; | ||
+ | padding: 5px 5px 5px 5px; | ||
+ | background: transparent; | ||
+ | color: transparent; | ||
+ | border-left: none; | ||
+ | border-right: none; | ||
+ | line-height: 0px; | ||
+ | z-index: 2; | ||
+ | } | ||
+ | |||
+ | #contentSub { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #bodyContent { | ||
+ | } | ||
+ | |||
+ | #siteSub { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | .firstHeading { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | margin-top:30px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | #top-section { | ||
+ | height: 20px; | ||
+ | width: 976px; | ||
+ | border-left: none; | ||
+ | border-right: none; | ||
+ | border-bottom: none; | ||
+ | } | ||
+ | |||
+ | .left-menu { | ||
+ | margin-top:-15px; | ||
+ | } | ||
+ | |||
+ | .left-menu ul { | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | #menubar li a { | ||
+ | color: #C03; | ||
+ | } | ||
+ | |||
+ | #menubar.right-menu { | ||
+ | margin-top:-15px; | ||
+ | } | ||
+ | .right-menu li a { | ||
+ | background-color: #000000; | ||
+ | } | ||
+ | .right-menu ul { | ||
+ | border: none; | ||
+ | } | ||
+ | |||
+ | #menubar{ | ||
+ | top:22px; | ||
+ | z-index:25; | ||
+ | } | ||
+ | |||
+ | img[src*="/wiki/skins/common/images/wiki.png"]{ | ||
+ | width:0; | ||
+ | height:0px; | ||
+ | padding-right:975px; | ||
+ | background:transparent url(https://2011.igem.org/wiki/skins/common/images/wiki.png) top left no-repeat; | ||
+ | } | ||
+ | element.style { | ||
+ | color: transparent; | ||
+ | cursor: default; | ||
+ | } | ||
+ | menubar ul { | ||
+ | color: transparent; | ||
+ | list-style: none; | ||
+ | list-style-type: none; | ||
+ | list-style-position: initial; | ||
+ | list-style-image: initial; | ||
+ | } | ||
+ | |||
+ | element.style { | ||
+ | } | ||
+ | |||
+ | |||
+ | #catlinks { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | |||
+ | #p-logo { | ||
+ | display:none; | ||
+ | position: absolute; | ||
+ | z-index: 1; | ||
+ | height: 0px; | ||
+ | width: 0px; | ||
+ | } | ||
+ | |||
+ | #pt-userpage{ | ||
+ | background-color: #000000; | ||
+ | } | ||
+ | #pt-preferences{ | ||
+ | background-color: #000000; | ||
+ | } | ||
+ | #pt-logout{ | ||
+ | background-color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* MAIN PAGE CSS */ | ||
+ | body { | ||
+ | font-family:Tahoma, Geneva, sans-serif; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | color:#FFFFFF; | ||
+ | background-color: #000000; | ||
+ | } | ||
+ | |||
+ | div.igemimage { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | z-index: 4; | ||
+ | right: -200px; | ||
+ | } | ||
+ | #header{ | ||
+ | height:220px; | ||
+ | width:100%; | ||
+ | font-family:"Arial Black", Gadget, sans-serif; | ||
+ | } | ||
+ | div.left_image{ | ||
+ | float:left; | ||
+ | border:none; | ||
+ | padding: 30px 30px 30px 30px; | ||
+ | } | ||
+ | div.right_image{ | ||
+ | float:right; | ||
+ | border:none; | ||
+ | padding: 30px 30px 30px 30px; | ||
+ | } | ||
+ | |||
+ | div.row{ | ||
+ | vertical-align:top; | ||
+ | } | ||
+ | div.summary_text{ | ||
+ | padding: 30px 30px 30px 30px; | ||
+ | border:none; | ||
+ | font-size:115%; | ||
+ | text-align:center; | ||
+ | } | ||
+ | div.descriptive_text{ | ||
+ | /*We must observe div.left_image to deffine the appropiate top-margin value*/ | ||
+ | margin: 70px 0px 0px 0px; | ||
+ | padding: 30px 30px 30px 30px; | ||
+ | border:none; | ||
+ | font-size:110%; | ||
+ | } | ||
+ | |||
+ | p.title{ | ||
+ | color:#CC4455; | ||
+ | font-size:150%; | ||
+ | } | ||
+ | |||
+ | #container { | ||
+ | margin: 0px auto; | ||
+ | text-align:justify; | ||
+ | width: 100%; | ||
+ | background-image:url(https://static.igem.org/mediawiki/2011/7/77/Unamgenomicsbackgroundtext.png); | ||
+ | color:#000000; | ||
+ | font-size: 110%; | ||
+ | } | ||
+ | |||
+ | /*TEXT CONTENT*/ | ||
+ | |||
+ | div#textContent{ | ||
+ | background-color: #333333; | ||
+ | background-image: url("https://static.igem.org/mediawiki/2011/7/77/Unamgenomicsbackgroundtext.png"); | ||
+ | background-repeat: repeat; | ||
+ | margin: 0px 0px 0px 0px; | ||
+ | padding: 15px 45px 15px 45px; | ||
+ | |||
+ | } | ||
+ | div.sliderimage { | ||
+ | width:612px | ||
+ | height:459px | ||
+ | } | ||
+ | |||
+ | div#textContent p{ | ||
+ | margin: .4em 0 .5em 0; | ||
+ | line-height: 1.5em; | ||
+ | } | ||
+ | h1,h2,h3,h4,h5,h6{ | ||
+ | border-bottom: none; | ||
+ | |||
+ | } | ||
+ | h1.NORM_header{ | ||
+ | text-align:left; | ||
+ | margin: 15px 1px 1px 1px; | ||
+ | border:none; | ||
+ | color:#000000; | ||
+ | font-size:200%; | ||
+ | text-decoration:bold; | ||
+ | } | ||
+ | |||
+ | h1.BSA_header{ | ||
+ | margin: 15px 1px 1px 1px; | ||
+ | border:none; | ||
+ | text-decoration:none; | ||
+ | color:#B0E; | ||
+ | font-size:110%; | ||
+ | } | ||
+ | h1.BSA_announce{ | ||
+ | margin: 20px 1px 1px 1px; | ||
+ | border:none; | ||
+ | text-decoration:none; | ||
+ | color:#B0E; | ||
+ | font-size:115%; | ||
+ | } | ||
+ | h1.BSA_announce a.HP{ | ||
+ | color:#B0E; | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | h1.BSA_announce a.HP:hover{ | ||
+ | font-size:120%; | ||
+ | } | ||
+ | |||
+ | #textContent a{ | ||
+ | text-decoration: underline; | ||
+ | color: #008800; /*green*/ | ||
+ | |||
+ | } | ||
+ | #textContent a:visited{ | ||
+ | color: #540054; /*lighter green*/ | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | |||
+ | #textContent a.anchor{ | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Image on hover description */ | ||
+ | |||
+ | td { | ||
+ | background-color: transparent; | ||
+ | background-repeat: no-repeat; | ||
+ | clear: both; | ||
+ | height: auto; | ||
+ | width: auto; | ||
+ | } | ||
+ | |||
+ | .imgteaser { | ||
+ | margin: 0; | ||
+ | overflow: hidden; | ||
+ | float: left; | ||
+ | position: relative; | ||
+ | } | ||
+ | .imgteaser a { | ||
+ | text-decoration: none; | ||
+ | float: left; | ||
+ | } | ||
+ | .imgteaser a:hover { | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .imgteaser a img { | ||
+ | float: left; | ||
+ | margin: 0; | ||
+ | border: none; | ||
+ | padding: 20px; | ||
+ | background: #FFF; | ||
+ | border: 0px solid #ddd; | ||
+ | } | ||
+ | |||
+ | .imgteaser a .desc { display: none; } | ||
+ | |||
+ | .imgteaser a:hover .desc{ | ||
+ | display: block; | ||
+ | font-size: 1.1em; | ||
+ | padding: 20px 0; | ||
+ | background: #111; | ||
+ | filter:alpha(opacity=65); | ||
+ | opacity:.65; | ||
+ | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /*--IE 8 Transparency--*/ | ||
+ | color: #fff; | ||
+ | position: absolute; | ||
+ | bottom: 11px; | ||
+ | left: 11px; | ||
+ | padding: 10px; | ||
+ | margin: 0; | ||
+ | width: 230px; | ||
+ | height:100px; | ||
+ | border-top: 1px solid #999; | ||
+ | } | ||
+ | .imgteaser a:hover .desc strong { | ||
+ | display: block; | ||
+ | margin-bottom: 5px; | ||
+ | font-size:1.2em; | ||
+ | } | ||
</style> | </style> | ||
+ | <script> | ||
+ | var $slider_started = false; | ||
+ | $(document).ready(function(){ | ||
+ | var $total_slider = $('.top-slider-main > div').length; | ||
+ | var $label_width = $('.top-slider-main div .left').width(); | ||
+ | var $max_slider_width = ($total_slider -1)*$label_width; | ||
+ | var $extra_margin = $('.top-slider-main div').width() - $label_width; | ||
+ | |||
+ | $('.top-slider-main div:not(.slider-box1) .left').mouseover(function(){ | ||
+ | var $slider_index = $('.top-slider-main > div').index($(this).parent()) + 1; | ||
+ | if($(this).parent().hasClass('on')) | ||
+ | { | ||
+ | if($slider_started != 1) | ||
+ | { | ||
+ | $slider_started = 2; | ||
+ | for(i=$total_slider; i>=$slider_index; i--) | ||
+ | { | ||
+ | var $elm = $('.top-slider-main .slider-box'+i); | ||
+ | if($elm.hasClass('on')) | ||
+ | { | ||
+ | $elm.removeClass('on'); | ||
+ | var $left_margin = ($label_width*(i-1)) + $extra_margin; | ||
+ | $elm.stop().animate({marginLeft : $left_margin}, 1500, function(){$slider_started = false;}); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | else | ||
+ | { | ||
+ | if($slider_started != 2) | ||
+ | { | ||
+ | $slider_started = 1; | ||
+ | for(i=2; i<=$slider_index; i++) | ||
+ | { | ||
+ | var $elm = $('.top-slider-main .slider-box'+i); | ||
+ | if(!$elm.hasClass('on')) | ||
+ | { | ||
+ | $elm.addClass('on'); | ||
+ | var $left_margin = ($label_width*(i-1)); | ||
+ | $elm.stop().animate({marginLeft : $left_margin}, 1500, function(){$slider_started = false;}); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
</head> | </head> | ||
<body> | <body> | ||
+ | <div id="globalWrapper"> | ||
+ | <div class="igemimage"><a href="/"><img src="https://static.igem.org/mediawiki/2011/0/03/UNAMGenomicsIGEMlogo.png" height="150"></a></div> | ||
+ | </div> | ||
+ | |||
+ | <div id="container"> | ||
+ | |||
+ | |||
+ | |||
+ | <div class="header"> | ||
+ | <img src="https://static.igem.org/mediawiki/2011/0/00/Unamgenomicshidrobiumetliheader2.jpg" width=" 976px" height="203px" id="Insert_logo" style="background: #8090AB; display:block; "></a> | ||
+ | |||
+ | <!-- Menu Code --> | ||
+ | <table border="0" align="center" cellpadding="0" cellspacing="0"> | ||
+ | <tr><td width="10" align="center" valign="center"> | ||
+ | <td> | ||
+ | <ul id="h2igemmenuOrange"> | ||
+ | |||
+ | <li class="istylei0orange" style="width:100px;"><a class="istylei0orange" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico"> Home </a></li> | ||
+ | </ul> | ||
+ | |||
+ | </td> | ||
+ | <td> | ||
+ | <ul id="h2igemmenupink"> | ||
+ | <li class="istylei0pink" style="width:100px;"><a class="istylei0pink" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Project"><span>Project</span><![if gt IE 6]></a><![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <ul class="istylem0pink" style="width:195px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Project/HydrogenProduction"><span>Hydrogen Production</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Project/RhizobialKit"><span>RhizoKit</span><![if gt IE 6]></a> | ||
+ | |||
+ | |||
+ | <li><a><span>Notebook</span><![if gt IE 6]></a> | ||
+ | <ul class="istylem0pink" style="width:173px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/SA">System Assembly</a></li> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/pBBR1MCS-5">pBBR1MCS-5</a></li> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/repC">repC</a></li> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/nifH">nifH</a></li> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/HydA">HydA</a></li> | ||
+ | |||
+ | </ul> | ||
+ | |||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Optimization"><span>Optimization</span><![if gt IE 6]></a> | ||
+ | <ul class="istylem0pink" style="width:173px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Notebook/hydaopt">HydA Optimization</a></li> </ul> | ||
+ | |||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Parts"><span>Parts</span><![if gt IE 6]></a> | ||
+ | |||
+ | |||
+ | <![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--></li> | ||
+ | </ul></ul> | ||
+ | </td> | ||
+ | <td> | ||
+ | <ul id="h2igemmenyellow"> | ||
+ | <li class="istylei0yellow" style="width:150px;"><a class="istylei0yellow" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/HumanPractices"><span>Human Practices</span><![if gt IE 6]></a><![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <ul class="istylem0yellow" style="width:195px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Bio-SintetizArte"><span>BioSintetizarte</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/HumanPractices/LawProposal"><span>Hydrobium etli goes Cuatzo</span><![if gt IE 6]></a> | ||
+ | <![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--></li> | ||
+ | </ul></ul> | ||
+ | </td> | ||
+ | <td> | ||
+ | <ul id="h2igemmenublue"> | ||
+ | |||
+ | <li class="istylei0blue" style="width:200px;"><a class="istylei0blue" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/SafetyQuestions"> Safety </a></li> | ||
+ | </ul> | ||
+ | <td> | ||
+ | <ul id="h2igemmenupurple"> | ||
+ | <li class="istylei0purple" style="width:104px;" ><a class="istylei0purple" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling"><span>Modeling</span><![if gt IE 6]></a><![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <ul class="istylem0purple" style="width:195px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling/FBA"><span>Flux Balance Analysis</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling/GT"><span>Game Theory</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling/MM"><span>Markov Model</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling/ExtremePathways"><span> Extreme Pathways</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Modeling/CA"><span>Celular Automaton</span><![if gt IE 6]></a> | ||
+ | <![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--></li> | ||
+ | </ul> | ||
+ | </ul> | ||
+ | </td> | ||
+ | <td> | ||
+ | <ul id="h2igemmenuOrange" > | ||
+ | <li class="istylei0orange" style="width:90px;" ><a class="istylei0orange" href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Team"><span> Team </span><![if gt IE 6]></a><![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <ul class="istylem0orange" style="width:195px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Team/Atributions"><span>Attributions</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Team/Individuals"><span>Individuals</span><![if gt IE 6]></a> | ||
+ | <![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <!--[if lte IE 6]></td></tr></table></a><![endif]--></li> | ||
+ | </ul> | ||
+ | </ul> | ||
+ | </td> | ||
+ | <td> | ||
+ | <ul id="h2igemmenuGreen"> | ||
+ | <li class="istylei0green" style="width:162px;"><a class="istylei0green" href="#"><span> Wiki Requirements</span><![if gt IE 6]></a><![endif]><!--[if lte IE 6]><table><tr><td><![endif]--> | ||
+ | <ul class="istylem0green" style="width:195px;"> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Team/Atributions"><span>Attributions</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Project"><span>Notebook</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Parts"><span>Parts</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Team"><span>Team</span><![if gt IE 6]></a> | ||
+ | <li><a href="https://2011.igem.org/Team:UNAM-Genomics_Mexico/Safety"><span>Safety</span><![if gt IE 6]></a> | ||
+ | </ul></li> | ||
+ | </ul> | ||
+ | </td> | ||
+ | |||
+ | </tr> | ||
+ | </table> | ||
+ | <!-- End: Menu code --> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div><!--class="header"--> | ||
+ | |||
+ | |||
</body> | </body> | ||
</html> | </html> | ||
+ | |||
+ | <div id="textContent"> | ||
+ | {{{content}}} | ||
+ | </div> |
Latest revision as of 01:57, 29 September 2011