Team:Buenos Aires

From 2013.igem.org

(Difference between revisions)
Line 5: Line 5:
         <meta name="description" content="iGem Buenos Aires" />
         <meta name="description" content="iGem Buenos Aires" />
         <meta name="keywords" content="biosensing, igem, buenos aires, UBA, arsenic"/>
         <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.css?action=raw&ctype=text/css" />
+
<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 -->
<link  href="http://fonts.googleapis.com/css?family=PT+Sans+Narrow:regular,bold" rel="stylesheet" type="text/css" /> <!-- Font -->
-
<link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Buenos_Aires/css/jquery.pageslide.css?action=raw&ctype=text/css" />
 
-
 
<style type ='text/css'>
<style type ='text/css'>
Line 20: Line 15:
#catlinks{display:none;}
#catlinks{display:none;}
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;}
#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: scroll; height:100%;overflow:hidden;}
+
#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%;}
#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;}
#top-section {display: block;position:fixed; height:3px; width:100%;z-index:999;}
Line 56: Line 51:
<div id="contenedor">
<div id="contenedor">
 +
 +
<div style="opacity:0.8;" class="swing"></div>
 +
<div id="ac_background" class="ac_background">
<div id="ac_background" class="ac_background">
-
<img class="ac_bgimage" src="https://static.igem.org/mediawiki/2013/thumb/b/b3/B4.jpg/800px-B4.jpg" alt="Background"/>
+
<img class="ac_bgimage" src="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" alt="Background"/>
-
<div class="ac_overlay"></div>
+
<div class="ac_loading"></div>
<div class="ac_loading"></div>
</div>
</div>
Line 70: Line 67:
<div class="ac_menu">
<div class="ac_menu">
<ul>
<ul>
-
                                        <li>
+
-
<a href="https://static.igem.org/mediawiki/2013/thumb/1/12/B3.jpg/800px-B3.jpg">Tour</a>
+
<!-- Wiki Tour -->
 +
    <li>
 +
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Tour">Tour</a>
<div class="ac_subitem">
<div class="ac_subitem">
<span class="ac_close"></span>
<span class="ac_close"></span>
<h2>Tour</h2>
<h2>Tour</h2>
<ul>
<ul>
-
<li>Take a wiki tour!</li>
+
<li>Take the guided wiki tour!</li>
</ul>
</ul>
</div>
</div>
</li>
</li>
 +
<!-- Team -->
<li>
<li>
-
<a href="https://static.igem.org/mediawiki/2013/thumb/b/b3/B4.jpg/800px-B4.jpg">Project</a>
+
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.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="Obj" href="_members">Members</a></li>
 +
 +
</ul>
 +
</div>
 +
</li>
 +
<!-- Project-->
 +
<li>
 +
 
 +
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Project">Project</a>
<div class="ac_subitem">
<div class="ac_subitem">
<span class="ac_close"></span>
<span class="ac_close"></span>
Line 90: Line 105:
<li><a class="sub_menu_link" id="Obj" href="_objetive">Objetive</a></li>
<li><a class="sub_menu_link" id="Obj" href="_objetive">Objetive</a></li>
<li><a class="sub_menu_link" id="Mot" href="_motivation">Motivation</a></li>
<li><a class="sub_menu_link" id="Mot" href="_motivation">Motivation</a></li>
-
<!-- <li><a class="sub_menu_link" id="App" href="#nada">Application</a></li>-->
+
<li><a class="sub_menu_link" id="App" href="_appli">Application</a></li>
 +
<li><a class="sub_menu_link" id="Sensor" href="_sensor">The Sensor</a></li>
 +
<li><a class="sub_menu_link" id="Reporter" href="_reporter">The Reporter</a></li>
</ul>
</ul>
</div>
</div>
</li>
</li>
 +
<!-- Results-->
<li>
<li>
-
<a href="https://static.igem.org/mediawiki/2013/thumb/1/12/B3.jpg/800px-B3.jpg">Results</a>
+
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Results">Results</a>
<div class="ac_subitem">
<div class="ac_subitem">
<span class="ac_close"></span>
<span class="ac_close"></span>
Line 101: Line 119:
<ul>
<ul>
<li>Results.</li>
<li>Results.</li>
 +
<li><a class="sub_menu_link" id="Obj" href="_results">Objetive</a></li>
</ul>
</ul>
</div>
</div>
</li>
</li>
 +
<!-- Parts -->
<li>
<li>
-
<a href="https://static.igem.org/mediawiki/2013/thumb/0/01/B2.jpg/800px-B2.jpg">Team</a>
+
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Parts">Parts</a>
<div class="ac_subitem">
<div class="ac_subitem">
<span class="ac_close"></span>
<span class="ac_close"></span>
-
<h2>Team</h2>
+
<h2>Parts</h2>
<ul>
<ul>
-
<li>The Team.</li>
+
<li>Our biobricks</li>
-
+
<li><a class="sub_menu_link" id="Obj" href="_results">Parts</a></li>
 +
</ul>
 +
</div>
 +
</li>
 +
<!-- Safety-->
 +
                    <li>
 +
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Safety">Safety</a>
 +
<div class="ac_subitem">
 +
<span class="ac_close"></span>
 +
<h2>Safety</h2>
 +
<ul>
 +
<li>Safety</li>
</ul>
</ul>
</div>
</div>
</li>
</li>
-
+
<!-- Human Practices-->
 +
                    <li>
 +
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.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>
 +
</ul>
 +
</div>
 +
</li>
 +
                    <li>
 +
<a id="https://static.igem.org/mediawiki/2013/3/31/Bg2-BsAs.jpg" href="#Sponsors">Sponsors</a>
 +
<div class="ac_subitem">
 +
<span class="ac_close"></span>
 +
<h2>Sponsonrs</h2>
 +
<ul>
 +
<li>Who supports our project</li>
 +
</ul>
 +
</div>
 +
</li>
</ul>
</ul>
</div>
</div>
Line 171: Line 222:
<script type="text/javascript" src="http://jquery-swip.googlecode.com/svn-history/r4/trunk/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="http://jquery-swip.googlecode.com/svn-history/r4/trunk/jquery.easing.1.3.js"></script>
-
     <script src="https://2013.igem.org/Team:Buenos_Aires/css/jquery.pageslide.js?action=raw&ctype=text/js"></script>
+
      
 +
 +
<!--Hace girar las bacterias cuando se pone el mouse arriba-->
 +
<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>
Line 196: Line 264:
*/
*/
$menuItems.each(function(i) {
$menuItems.each(function(i) {
-
$ItemImages.push($(this).children('a:first').attr('href'));
+
$ItemImages.push($(this).children('a:first').attr('id'));
});
});
$ItemImages.push($ac_bgimage.attr('src'));
$ItemImages.push($ac_bgimage.attr('src'));
Line 204: Line 272:
var init = function() {
var init = function() {
loadPage();
loadPage();
-
initWindowEvent();
+
//initWindowEvent();
},
},
loadPage = function() {
loadPage = function() {
Line 243: Line 311:
slideOutMenu = function() {
slideOutMenu = function() {
/* calculate new width for the menu */
/* calculate new width for the menu */
-
var new_w = $(window).width() - $title.outerWidth(true);
+
var new_w = 1024 - $title.outerWidth(true) - 15;
 +
/* All links blank */
 +
$("a").css('color', '#FFF');
return $.Deferred(
return $.Deferred(
function(dfd) {
function(dfd) {
Line 291: Line 361:
var $item = $(this), // the <li>
var $item = $(this), // the <li>
$el_title = $item.children('a:first'),
$el_title = $item.children('a:first'),
-
el_image = $el_title.attr('href'),
+
el_image = $el_title.attr('id'),
$sub_menu = $item.find('.ac_subitem'),
$sub_menu = $item.find('.ac_subitem'),
$ac_close = $sub_menu.find('.ac_close');
$ac_close = $sub_menu.find('.ac_close');
Line 300: Line 370:
/* user clicks one item : appetizers | main course | desserts | wines | specials */
/* user clicks one item : appetizers | main course | desserts | wines | specials */
$el_title.bind('click.Menu', function(e) {
$el_title.bind('click.Menu', function(e) {
-
$.when(toggleMenuItems('down')).done(function(){
+
 +
/* 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);
openSubMenu($item, $sub_menu, el_image);
-
});
+
//});
return false;
return false;
Line 310: Line 392:
toggleMenuItems('up');
toggleMenuItems('up');
$(".ac_subitem").css("height", "0px");
$(".ac_subitem").css("height", "0px");
 +
$(".ac_subitem").css("border", "none");
/* all other text display is none*/
/* all other text display is none*/
$('.texto').css({opacity: '0.0', display: 'none'});
$('.texto').css({opacity: '0.0', display: 'none'});
Line 333: Line 416:
loadText = function(link) {
loadText = function(link) {
-
 
+
$(".ac_subitem a").css('color', '#FFF');
/* Change opacity for later animatation*/
/* Change opacity for later animatation*/
$('.texto').css({opacity:'0.0'});
$('.texto').css({opacity:'0.0'});
 +
                                                $('.texto').css({display: 'none'});
 +
$(link).css('color', '#000');
new_link = $(link).attr('href')+ " #external";
new_link = $(link).attr('href')+ " #external";
Line 361: Line 446:
openSubMenu = function($item, $sub_menu, el_image) {
openSubMenu = function($item, $sub_menu, el_image) {
 +
 +
$sub_menu.appendTo('#contenedor');
$sub_menu.stop()
$sub_menu.stop()
.animate({
.animate({
height : '400px',
height : '400px',
-
marginTop : '-200px'
+
marginTop : '120px'
 +
}, 400, function() {
}, 400, function() {
//the bg image changes
//the bg image changes
 +
$sub_menu.css({border: "solid black"});
showItemImage(el_image);
showItemImage(el_image);
});
});
Line 400: Line 489:
/* makes an image "fullscreen" and centered */
/* makes an image "fullscreen" and centered */
adjustImageSize = function($img) {
adjustImageSize = function($img) {
-
var w_w = $(window).width(),
 
-
w_h = $(window).height(),
 
-
r_w = w_h / w_w,
 
-
i_w = $img.width(),
 
-
i_h = $img.height(),
 
-
r_i = i_h / i_w,
 
-
new_w,new_h,
 
-
new_left,new_top;
 
-
 
-
if(r_w > r_i){
 
-
new_h = w_h;
 
-
new_w = w_h / r_i;
 
-
}
 
-
else{
 
-
new_h = w_w * r_i;
 
-
new_w = w_w;
 
-
}
 
$img.css({
$img.css({
-
width : new_w + 'px',
+
width : 1024 + 'px',
-
height : new_h + 'px',
+
height : $(window).height + 'px',
});
});

Revision as of 00:26, 16 July 2013

iGem Buenos Aires

Background

Buenos AiresiGem

Hola

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