Team:Buenos Aires/Template/

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html lang="en">
+
<html>
     <head>
     <head>
-
         <title>iGem Buenos Aires</title>
+
         <style>
-
<meta charset=utf-8>
+
-
        <meta name="description" content="iGem Buenos Aires" />
+
-
        <meta name="keywords" content="biosensing, igem, buenos aires, UBA, arsenic"/>
+
-
<link rel="stylesheet" type="text/css" rel="stylesheet" href="https://2013.igem.org/Team:Buenos_Aires/css/style_color.css?action=raw&ctype=text/css" />
+
-
<link  href="http://fonts.googleapis.com/css?family=PT+Sans+Narrow:regular,bold" rel="stylesheet" type="text/css" /> <!-- Font -->
+
/*take away Search box, Team:Berkeley/Style heading. Shrink the top section. Will add another logo later when making the header and sidebar*/
-
<style type ='text/css'>
+
.firstHeading, #catlinks {
-
/* Wiki Hacks - START */
+
    display:none;
-
/* Author: Pieter van Boheemen */
+
-
/* Team: TU Delft */
+
-
#catlinks{display:none;}
+
-
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;}
+
-
#content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; overflow: auto; height:100%;}
+
-
#bodyContent {background-color:transparent; border: none; padding:0; margin:0; width:100%; height:100%;}
+
-
#top-section {display: block;position:fixed; height:3px; width:100%;z-index:999;}
+
-
#p-logo {display: none;}
+
-
#search-controls {display: none;}
+
-
#footer-box {display: none;}
+
-
.visualClear { display: none; }
+
-
#footer { border: none; width: 100%; margin: 0 auto; padding: 0;}
+
-
.firstHeading { display: none;}
+
-
#f-list a { color: #333; font-size: 10px;}
+
-
#f-list a:hover { color: #666;}
+
-
.printfooter { display: none; }
+
-
#search-controls { display:none; }
+
-
h3#siteSub { display: none;}
+
-
#contentSub {display: none;}
+
-
p:first-child { display: none;}
+
-
/* Wiki Hacks - END */
+
-
 
+
-
 
+
-
li{
+
-
color:#FFF;
+
}
}
-
h1{
 
-
border:none;
 
-
}
 
-
 
-
</style>
 
 +
            *{
 +
                padding:0;
 +
                margin:0;
 +
            }
 +
body{
 +
                background:#f0f0f0;
 +
                font-family:"Helvetica Neue",Arial,Helvetica,Geneva,sans-serif;
 +
overflow-x:hidden;
 +
            }
 +
            }
 +
            span.reference{
 +
                position:fixed;
 +
                left:10px;
 +
                bottom:10px;
 +
                font-size:11px;
 +
            }
 +
            span.reference a{
 +
                color:#DF7B61;
 +
                text-decoration:none;
 +
                text-transform: uppercase;
 +
                text-shadow:0 1px 0 #fff;
 +
            }
 +
            span.reference a:hover{
 +
                color:#000;
 +
            }
 +
            .box{
 +
                margin-top:129px;
 +
                height:460px;
 +
width:100%;
 +
                position:relative;
 +
                background:#fff url(click.png) no-repeat 380px 180px;
 +
-moz-box-shadow:0px 0px 10px #aaa;
 +
-webkit-box-shadow:0px 0px 10px #aaa;
 +
-box-shadow:0px 0px 10px #aaa;
 +
            }
 +
            .box h2{
 +
color:#f0f0f0;
 +
padding:10px 10px;
 +
text-shadow:1px 1px 1px #ccc;
 +
            }
 +
ul.ldd_menu{
 +
margin:0px;
 +
padding:0;
 +
display:block;
 +
height:50px;
 +
background-color:#009ee1;
 +
list-style:none;
 +
font-family:"Trebuchet MS", sans-serif;
 +
border-top:1px solid #009ee1;
 +
border-bottom:1px solid #004a99;
 +
border-left:10px solid #009ee1;
 +
-moz-box-shadow:0px 3px 4px #004a99;
 +
-webkit-box-shadow:0px 3px 4px #004a99;
 +
-box-shadow:0px 3px 4px #004a99;
 +
}
 +
ul.ldd_menu a{
 +
text-decoration:none;
 +
}
 +
ul.ldd_menu > li{
 +
float:left;
 +
position:relative;
 +
}
 +
ul.ldd_menu > li > span{
 +
float:left;
 +
color:#fff;
 +
background-color:#009ee1;
 +
height:50px;
 +
line-height:50px;
 +
cursor:default;
 +
padding:0px 20px;
 +
text-shadow:0px 0px 1px #fff;
 +
border-right:1px solid #bedeec;
 +
border-left:1px solid #009ee1;
 +
}
 +
ul.ldd_menu .ldd_submenu{
 +
position:absolute;
 +
top:50px;
 +
width:550px;
 +
display:none;
 +
opacity:0.95;
 +
left:0px;
 +
font-size:10px;
 +
background: #008ae1;
 +
border-top:1px solid #004a99;
 +
-moz-box-shadow:0px 3px 4px #004a99 inset;
 +
-webkit-box-shadow:0px 3px 4px #004a99 inset;
 +
-box-shadow:0px 3px 4px #004a99 inset;
 +
}
 +
a.ldd_subfoot{
 +
background-color:#f0f0f0;
 +
color:#444;
 +
display:block;
 +
clear:both;
 +
padding:15px 20px;
 +
text-transform:uppercase;
 +
font-family: Arial, serif;
 +
font-size:12px;
 +
text-shadow:0px 0px 1px #fff;
 +
-moz-box-shadow:0px 0px 2px #777 inset;
 +
-webkit-box-shadow:0px 0px 2px #777 inset;
 +
-box-shadow:0px 0px 2px #777 inset;
 +
}
 +
ul.ldd_menu ul{
 +
list-style:none;
 +
float:left;
 +
border-left:1px solid #bedeec;
 +
margin:20px 0px 10px 30px;
 +
padding:10px;
 +
}
 +
li.ldd_heading{
 +
font-family: Georgia, serif;
 +
font-size: 13px;
 +
font-style: italic;
 +
color:#FFB39F;
 +
text-shadow:0px 0px 1px #B03E23;
 +
padding:0px 0px 10px 0px;
 +
}
 +
ul.ldd_menu ul li a{
 +
font-family: Arial, serif;
 +
font-size:10px;
 +
line-height:20px;
 +
color:#fff;
 +
padding:1px 3px;
 +
}
 +
ul.ldd_menu ul li a:hover{
 +
-moz-box-shadow:0px 0px 2px #333;
 +
-webkit-box-shadow:0px 0px 2px #333;
 +
box-shadow:0px 0px 2px #333;
 +
background:#AF412B;
 +
}
 +
headerimage{width:575px;margin-top:-18px;}
 +
        </style>
     </head>
     </head>
     <body>
     <body>
-
+
<div style="width:475px;margin-top:-18px;">
 +
<img src="https://static.igem.org/mediawiki/2012/3/32/Bsas2011-headwiki.gif" style="width:966px;" />
 +
</div>
-
<div id="ac_content" class="ac_content">
 
-
 
-
<h1><a href="https://igem.org"><img src="https://static.igem.org/mediawiki/igem.org/f/f2/Igemfooterlogo.png"></a><span><b>Buenos Aires</b></span></h1>
 
-
<div class="ac_menu">
 
-
<ul>
 
-
 
-
<!-- Wiki Summary -->
 
-
    <li>
 
-
<a id="https://static.igem.org/mediawiki/2013/4/4e/Bg_bact2.jpg" href="#Summary">Summary</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Summary</h2>
 
-
<ul>
 
-
<li>Here you can find a brief introduction to our project</li>
 
-
                                                                <li><a class="sub_menu_link" id="Summary" href="/Team:Buenos_Aires/_summary">Summary</a></li>
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
<!-- Team -->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/9/9a/Bg_bact3.jpg" href="#Team">Team</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Team</h2>
 
-
<ul>
 
-
<li>The Team.</li>
 
-
<li><a class="sub_menu_link" id="Students" href="/Team:Buenos_Aires/_students">Students</a></li>
 
-
                                                                <li><a class="sub_menu_link" id="Advisors" href="/Team:Buenos_Aires/_advisors">Advisors</a></li>
 
-
                                                                <li><a class="sub_menu_link" id="Instructors" href="/Team:Buenos_Aires/_instructors">Instructors</a></li>
 
-
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
<!-- Project-->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/e/e3/Bg_bact4.jpg" href="#Project">Project</a>
+
<ul id="ldd_menu" class="ldd_menu">
-
<div class="ac_subitem">
+
<li>
-
<span class="ac_close"></span>
+
<span>iGEM BsAs</span><!-- Increases to 510px in width-->
-
<h2>Project</h2>
+
<div class="ldd_submenu">
-
<ul>
+
<ul>
-
<li> We aim to build a quantitative modular Biosensor for the detection of
+
<li class="ldd_heading">The team</li>
-
toxic pollutants in water</li>
+
<li><a href="https://igem.org/Team.cgi?id=792">Official roster</a></li>
-
<li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_abstract">Abstract</a></li>
+
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Team/Members">Members</a></li>
-
<li><a class="sub_menu_link" id="Mot" href="/Team:Buenos_Aires/_motivation">Motivation</a></li>
+
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Team/BsAs">Where we come from</a></li>
-
<li><a class="sub_menu_link" id="Device" href="/Team:Buenos_Aires/_device">The Device</a></li>
+
</ul>
 +
<ul>
 +
<li class="ldd_heading">Safety</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Safety">Key questions</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">Attributions</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Attributions">Attributions</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">Sponsors</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Sponsors">Institutional</a></li>
 +
</ul>
 +
<a class="ldd_subfoot" href="https://2012.igem.org/Team:Buenos_Aires/DataPage#Data_Page">Data Page</a>
 +
</div>
 +
</li>
 +
<li>
 +
<span>Project</span>
 +
<div class="ldd_submenu">
 +
<ul>
 +
<li class="ldd_heading">Synthetic ecology</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project">Overview</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project#Motivation">Motivation</a></li>
 +
      <li><a href="https://2012.igem.org/Team:Buenos_Aires/Project#Design">Design</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project#Possible_applications">Possible applications</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">Schemes</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/Schemes">Crossfeeding</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/Schemes#Independent_Population_Control">Independent Population Control</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/Schemes#Cross-population_control">Cross-population control</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/Schemes#Stochastic_State_Transitions">Stochastic State Transitions</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">Modeling</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/Model">Modeling synEcology</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Project/ModelAdvance">Advanced modeling</a></li>
 +
</ul>
 +
<a class="ldd_subfoot" href="https://2012.igem.org/Team:Buenos_Aires/DataPage#Data_Page">Data Page</a>
 +
</div>
 +
</li>
 +
<li>
 +
<span>Results and Devices</span>
 +
<div class="ldd_submenu">
 +
<ul>
 +
<li class="ldd_heading">Strains characterization</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Description_of_strains">Strains description</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Measurment_of_strains_fluorescence">Fluorescence screening</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Screening_of_strain_proportion">Screening of strain proportion</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Auxotrophy_confirmation">Auxotrophy confirmation</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Coculture_in_liquid_medium">Coculture in liquid medium</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Coculture_in_Agar_and_Revertant_mutation_control">Revertant control</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Measurement_of_Trp_in_medium_and_Basal_Production">Trp basal production</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Strains#Growth_dependence_on_the_Trp_and_His_concentrations">Growth dependence </a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">BBs design</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Bb1">Trp/His export devices</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Bb2">Backup devices</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/Cloning">Preparing for sending</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">Testing</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/DevicesTesting">BioBricks testing</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/Results/SynEcoTesting">SynEco testing</a></li>
 +
</ul>
 +
<a class="ldd_subfoot" href="https://2012.igem.org/Team:Buenos_Aires/DataPage#Data_Page">Data Page</a>
 +
</div>
 +
</li>
 +
                                <li>
 +
<span>Human practices</span>
 +
<div class="ldd_submenu">
 +
<ul>
 +
<li class="ldd_heading">Garage Lab</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/HP/GarageLab">Spreading the word</a></li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/HP/GarageLab#Future_plans">Solving local problems</a></li>
 +
</ul>
 +
<ul>
 +
<li class="ldd_heading">EMBO</li>
 +
<li><a href="https://2012.igem.org/Team:Buenos_Aires/HP/EMBO#EMBO_Course_Buenos_Aires_2012">Seeding SynBio in Latin America</a></li>
 +
</ul>
 +
<a class="ldd_subfoot" href="https://2012.igem.org/Team:Buenos_Aires/DataPage#Data_Page">Data Page</a>
 +
</div>
 +
</li>
 +
</ul>
-
</ul>
 
-
</div>
 
-
</li>
 
-
 
-
<!-- Model-->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/d/d0/Bg_bact5.jpg" href="#Model">Model</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Model</h2>
 
-
<ul>
 
-
<li>Mathematical model</li>
 
-
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
 
-
<!-- Results-->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/d/d0/Bg_bact5.jpg" href="#Results">Results</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Results</h2>
 
-
<ul>
 
-
<li>Results of our experiments</li>
 
-
<li><a class="sub_menu_link" id="resRFP" href="/Team:Buenos_Aires/_res_rfpdeg">Model</a></li>
 
-
<li><a class="sub_menu_link" id="resmRFP" href="/Team:Buenos_Aires/_res_qrfp">mRFP quantification</a></li>
 
-
<li><a class="sub_menu_link" id="resGFPr" href="/Team:Buenos_Aires/_res_rgfp">Response of GFP</a></li>
 
-
<li><a class="sub_menu_link" id="resdmRFP" href="/Team:Buenos_Aires/_res_dmrfp">Discenibility of mRFP</a></li>
 
-
<li><a class="sub_menu_link" id="resBasu" href="/Team:Buenos_Aires/_res_basu">Basu</a></li>
 
-
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
 
-
 
-
<!-- Lab-->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/d/d0/Bg_bact5.jpg" href="#Lab">Lab</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Lab</h2>
 
-
<ul>
 
-
<li>Lab</li>
 
-
 
-
                                                                <li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_protocols">Protocols</a></li>
 
-
 
-
<li><a class="sub_menu_link" id="Wetgallery" href="/Team:Buenos_Aires/_wetgallery">Gallery</a></li>
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
 
-
 
-
 
-
<!-- Parts -->
 
-
<li>
 
-
<a id="https://static.igem.org/mediawiki/2013/8/8f/Bg_bact6.jpg" href="#Parts">Parts</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Parts</h2>
 
-
<ul>
 
-
<li>Our biobricks</li>
 
-
<li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_parts">Parts Used</a></li>
 
-
                                                                <li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_parts">Parts Submitted</a></li>
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
<!-- Safety-->
 
-
                    <li>
 
-
<a id="https://static.igem.org/mediawiki/2013/8/8f/Bg_bact6.jpg" href="#Safety">Safety</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Safety</h2>
 
-
<ul>
 
-
<li>Safety practices</li>
 
-
<li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_safety">Safety</a></li>
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
<!-- Human Practices-->
 
-
                    <li>
 
-
<a id="https://static.igem.org/mediawiki/2013/8/8f/Bg_bact6.jpg" href="#Human Practice">Human Practice</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>Human Practice</h2>
 
-
<ul>
 
-
<li>The social objetive behind the competition</li>
 
-
<li><a class="sub_menu_link" id="Obj" href="/Team:Buenos_Aires/_humanpractice">Human Practice</a></li>
 
-
 
-
<li><a class="sub_menu_link" id="Outreach" href="/Team:Buenos_Aires/_outreach">Community Outreach</a></li>
 
-
 
-
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
                    <li>
 
-
<a id="https://static.igem.org/mediawiki/2013/8/8f/Bg_bact6.jpg" href="#References">References</a>
 
-
<div class="ac_subitem">
 
-
<span class="ac_close"></span>
 
-
<h2>References</h2>
 
-
<ul>
 
-
                                                                <li>Our inspiration</li>
 
-
                                                         
 
-
<li><a class="sub_menu_link" id="Ref" href="/Team:Buenos_Aires/_references">References</a></li>
 
-
</ul>
 
-
</div>
 
-
</li>
 
-
 
-
</ul>
 
-
</div>
 
-
</div>
 
-
 
-
 
-
<!--Here i put all the text that will open with links:-->
 
-
 
-
<!--PROJECT-->
 
-
 
-
<!--Objetive-->
 
-
<!-- <iframe class="restricted" id="textObj" scrolling="no"-->
 
-
<div class="text_loading"> Loading... </div>
 
-
<div class="texto" id="textExt"> Hola
 
-
 
-
</div>
 
-
 
-
 
-
 
-
 
<!-- The JavaScript -->
<!-- The JavaScript -->
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
+
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
-
<script type="text/javascript" src="http://jquery-swip.googlecode.com/svn-history/r4/trunk/jquery.easing.1.3.js"></script>
+
        <script type="text/javascript">
-
 
+
            $(function() {
-
   
+
/**
-
 
+
* the menu
-
 
+
*/
-
<!--Hace girar las bacterias cuando se pone el mouse arriba-->
+
var $menu = $('#ldd_menu');
-
<script type="text/javascript">
+
-
$(document).ready(function(){
+
-
  $(".swing").hover(function(){
+
-
    $(".swing").css('-moz-transform', 'rotate(360deg)');
+
-
    $(".swing").css('-webkit-transform', 'rotate(360deg)');
+
-
    $(".swing").css('-o-transform', 'rotate(360deg)');
+
-
    $(".swing").css('-ms-transform', 'rotate(360deg)');
+
-
    },function(){
+
-
    $(".swing").css('-moz-transform', 'rotate(-360deg)');
+
-
    $(".swing").css('-webkit-transform', 'rotate(-360deg)');
+
-
    $(".swing").css('-o-transform', 'rotate(-360deg)');
+
-
    $(".swing").css('-ms-transform', 'rotate(-360deg)');
+
-
  });
+
-
});
+
-
</script>
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
+
-
<script type="text/javascript">
+
-
$(function() {
+
-
var $ac_background = $('#ac_background'),
+
-
$ac_bgimage = $ac_background.find('.ac_bgimage'),
+
-
$ac_loading = $ac_background.find('.ac_loading'),
+
-
+
-
$ac_content = $('#ac_content'),
+
/**
-
$title = $ac_content.find('h1'),
+
* for each list element,
-
$menu = $ac_content.find('.ac_menu'),
+
* we show the submenu when hovering and
-
$mainNav = $menu.find('ul:first'),
+
* expand the span element (title) to 510px
-
$menuItems = $mainNav.children('li'),
+
*/
-
totalItems = $menuItems.length,
+
$menu.children('li').each(function(){
-
$ItemImages = new Array();
+
var $this = $(this);
-
+
var $span = $this.children('span');
-
/*  
+
$span.data('width',$span.width());
-
for this menu, we will preload all the images.
+
-
let's add all the image sources to an array,
+
-
including the bg image
+
-
*/
+
-
$menuItems.each(function(i) {
+
-
$ItemImages.push($(this).children('a:first').attr('id'));
+
-
});
+
-
$ItemImages.push($ac_bgimage.attr('src'));
+
-
 
+
-
+
-
var Menu = (function(){
+
-
var init = function() {
+
-
loadPage();
+
-
initWindowEvent();
+
-
},
+
-
loadPage = function() {
+
-
/*
+
-
1- loads the bg image and all the item images;
+
-
2- shows the bg image;
+
-
3- shows / slides out the menu;
+
-
4- shows the menu items;
+
-
5- initializes the menu items events
+
-
*/
+
-
+
-
$ac_loading.show();//show loading status image
+
-
$.when(loadImages()).done(function(){
+
-
$.when(showBGImage()).done(function(){
+
-
//hide the loading status image
+
-
$ac_loading.hide();
+
-
$.when(slideOutMenu()).done(function(){
+
-
$.when(toggleMenuItems('up')).done(function(){
+
-
initEventsSubMenu();
+
-
});
+
-
});
+
-
});
+
-
});
+
-
},
+
-
+
-
 
+
$this.bind('mouseenter',function(){
-
 
+
$menu.find('.ldd_submenu').stop(true,true).hide();
-
showBGImage = function() {
+
$span.stop().animate({'width':'510px'},300,function(){
-
return $.Deferred(
+
$this.find('.ldd_submenu').slideDown(300);
-
function(dfd) {
+
-
//adjusts the dimensions of the image to fit the screen
+
-
adjustImageSize($ac_bgimage);
+
-
$ac_bgimage.fadeIn(1000, dfd.resolve);
+
-
}
+
-
).promise();
+
-
},
+
-
slideOutMenu = function() {
+
-
/* calculate new width for the menu */
+
-
if($("#contenedor").width() > 1100){
+
-
var new_w = $("#contenedor").width() - $title.outerWidth(true) - 15;
+
-
} else {
+
-
var new_w = 1024 - $title.outerWidth(true) - 15;
+
-
}
+
-
$(".texto").css('width', new_w - 130 + 'px');
+
-
/* All links blank */
+
-
$("a").css('color', '#FFF');
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
//slides out the menu
+
-
$menu.stop()
+
-
.animate({
+
-
width : new_w + 'px'
+
-
}, 700, dfd.resolve);
+
-
}
+
-
).promise();
+
-
},
+
-
/* shows / hides the menu items */
+
-
toggleMenuItems = function(dir) {
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
/*
+
-
slides in / out the items.
+
-
different animation time for each one.
+
-
*/
+
-
$menuItems.each(function(i) {
+
-
var $el_title = $(this).children('a:first'),
+
-
marginTop, opacity, easing;
+
-
if(dir === 'up'){
+
-
marginTop = '0px';
+
-
opacity = 1;
+
-
easing = 'easeOutBack';
+
-
}
+
-
else if(dir === 'down'){
+
-
marginTop = '60px';
+
-
opacity = 0;
+
-
easing = 'easeInBack';
+
-
}
+
-
$el_title.stop()
+
-
.animate({
+
-
marginTop : marginTop,
+
-
opacity : opacity
+
-
}, 200 + i * 200 , easing, function(){
+
-
if(i === totalItems - 1)
+
-
dfd.resolve();
+
-
});
+
-
});
+
-
}
+
-
).promise();
+
-
},
+
-
initEventsSubMenu = function() {
+
-
$menuItems.each(function(i) {
+
-
var $item = $(this), // the <li>
+
-
$el_title = $item.children('a:first'),
+
-
el_image = $el_title.attr('id'),
+
-
$sub_menu = $item.find('.ac_subitem'),
+
-
$ac_close = $sub_menu.find('.ac_close');
+
-
$text_loading = $('.text_loading');
+
-
 
+
-
if(i==0){
+
-
openSubMenu($item, $sub_menu, el_image);
+
-
loadText($("#Summary"));
+
-
}
+
-
 
+
-
+
-
/* user clicks one item : appetizers | main course | desserts | wines | specials */
+
-
$el_title.bind('click.Menu', function(e) {
+
-
+
-
/* Menu Items doesnt disappear when link cliked */
+
-
$(".ac_subitem").css("height", "0px");
+
-
$(".ac_subitem").css("border", "none");
+
-
/* all other text display is none*/
+
-
//$('.texto').css({opacity: '0.0', display: 'none'});
+
-
/* Mark other links as blank */
+
-
$(".ac_content a").css('color', '#FFF');
+
-
/* Current link in black */
+
-
$el_title.css('color', '#000');
+
-
+
-
+
-
//$.when(toggleMenuItems('down')).done(function(){
+
-
openSubMenu($item, $sub_menu, el_image);
+
-
//});
+
-
+
-
return false;
+
-
});
+
-
/* closes the submenu */
+
-
$ac_close.bind('click.Menu', function(e) {
+
-
toggleMenuItems('up');
+
-
$(".ac_subitem").css("height", "0px");
+
-
$(".ac_subitem").css("border", "none");
+
-
/* all other text display is none*/
+
-
$('.texto').css({opacity: '0.0', display: 'none'});
+
-
+
-
return false;
+
-
});
+
-
/* open link's text in "texto" class div */
+
-
+
-
+
-
$(".sub_menu_link").bind('click.Menu', function(){
+
-
loadText(this);
+
-
 
+
-
return false;
+
-
+
-
});
+
-
 
+
-
+
-
+
-
+
});
});
-
},
+
}).bind('mouseleave',function(){
-
+
$this.find('.ldd_submenu').stop(true,true).hide();
-
 
+
$span.stop().animate({'width':$span.data('width')+'px'},300);
-
loadText = function(link) {
+
});
-
+
});
-
$(".ac_subitem a").css('color', '#FFF');
+
            });
-
/* Change opacity for later animatation*/
+
        </script>
-
$('.texto').css({opacity:'0.2'});
+
-
                                              // $('.texto').css({display: 'none'});
+
-
+
-
$(link).css('color', '#000');
+
-
new_link = $(link).attr('href')+ " #external";
+
-
                                                $text_loading.appendTo('#Contenedor');
+
-
$text_loading.show();
+
-
 
+
-
$('#textExt').load(new_link, function() {
+
-
/* hide loading text: */
+
-
                                        $text_loading.hide();
+
-
/*show external div in textExt*/
+
-
$('#textExt').css({display: 'block'});
+
-
$('#textExt').stop()
+
-
.animate({opacity: '1'}, 1400, function(){});
+
-
/*Bind function recursivily in the links of the external*/
+
-
                                                        $('.texto a').css({color:"#68A"});
+
-
 
+
-
cargar();
+
-
$('a.external.text').bind('click.Menu', function(){
+
-
loadText(this);
+
-
return false;
+
-
});
+
-
 
+
-
 
+
-
$('td a').bind('click.Menu', function(){
+
-
loadText(this);
+
-
return false;
+
-
});
+
-
});
+
-
 
+
-
+
-
 
+
-
+
-
+
-
},
+
-
 
+
-
/* Carga una función javascript cuando abro un external link */
+
-
cargar =function(){
+
-
  $.getScript('https://2013.igem.org/Team:Buenos_Aires/js/external.js?action=raw&ctype=text/javascript', function() {
+
-
  externa(); /*In this callback function you can fire the methods/functions defined in the loaded script file.*/
+
-
  prueba();
+
-
});
+
-
},
+
-
 
+
-
openSubMenu = function($item, $sub_menu, el_image) {
+
-
+
-
$sub_menu.appendTo('#contenedor');
+
-
$sub_menu.stop()
+
-
.animate({
+
-
height : '400px',
+
-
marginTop : '120px'
+
-
+
-
}, 400, function() {
+
-
//the bg image changes
+
-
$sub_menu.css({border: "solid black"});
+
-
showItemImage(el_image);
+
-
});
+
-
},
+
-
/* changes the background image */
+
-
showItemImage = function(source) {
+
-
//if its the current one return
+
-
if($ac_bgimage.attr('src') === source)
+
-
return false;
+
-
+
-
var $itemImage = $('<img src="'+source+'" alt="Background" class="ac_bgimage"/>');
+
-
$itemImage.insertBefore($ac_bgimage);
+
-
adjustImageSize($itemImage);
+
-
$ac_bgimage.fadeOut(1500, function() {
+
-
$(this).remove();
+
-
$ac_bgimage = $itemImage;
+
-
});
+
-
$itemImage.fadeIn(1500);
+
-
},
+
-
/*
+
-
on window resize, ajust the bg image dimentions,
+
-
and recalculate the menus width
+
-
*/
+
-
initWindowEvent = function() {
+
-
/* on window resize set the width for the menu */
+
-
$(window).bind('resize.Menu' , function(e) {
+
-
adjustImageSize($ac_bgimage);
+
-
/* calculate new width for the menu */
+
-
var new_w = $("#contenedor").width() - $title.outerWidth(true) - 15;
+
-
$menu.css('width', new_w + 'px');
+
-
                            $(".texto").css('width', new_w - 130 + 'px');
+
-
                                                       
+
-
});
+
-
},
+
-
/* makes an image "fullscreen" and centered */
+
-
adjustImageSize = function($img) {
+
-
+
-
$img.css({
+
-
width : $(window).width + 'px',
+
-
height : $(window).height + 'px',
+
-
+
-
});
+
-
},
+
-
/* preloads a set of images */
+
-
loadImages = function() {
+
-
return $.Deferred(
+
-
function(dfd) {
+
-
var total_images = $ItemImages.length,
+
-
loaded = 0;
+
-
for(var i = 0; i < total_images; ++i){
+
-
$('<img/>').load(function() {
+
-
++loaded;
+
-
if(loaded === total_images)
+
-
dfd.resolve();
+
-
}).attr('src' , $ItemImages[i]);
+
-
}
+
-
}
+
-
).promise();
+
-
};
+
-
+
-
return {
+
-
init : init
+
-
};
+
-
})();
+
-
+
-
/*
+
-
call the init method of Menu
+
-
*/
+
-
Menu.init();
+
-
});
+
-
</script>
+
     </body>
     </body>
</html>
</html>

Revision as of 23:16, 22 September 2013

Retrieved from "http://2013.igem.org/Team:Buenos_Aires/Template/"