Difference between revisions of "Team:UCSC/Team"

Line 1: Line 1:
 
{{UCSC}}
 
{{UCSC}}
 +
  
 
<html>
 
<html>
<head>
+
<style>
 
+
+
 
+
  <!-- External scripts -->
+
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600'
+
rel='stylesheet' type='text/css'>
+
  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
+
  <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'>
+
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
+
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+
 
+
  <!-- Functionallity and behaviour JS -->
+
  <script>
+
 
+
    $(document).ready(function(){
+
 
+
      //Loading screen functionallity
+
      $('.loading').animate(
+
          {opacity:0},
+
          500,
+
          function(){
+
            $('.loading').attr("style", "display:none");
+
          }
+
      );
+
 
+
      //Height responsiveness
+
      $(window).resize(function() {
+
          wheight = $(window).height();
+
          $('.container').attr("style","height:"+(wheight)+"px;background-size:cover;");
+
          $('.team-member-container').attr("style","height:"+wheight/2.7+"px;");
+
      });
+
 
+
      $(window).trigger('resize');
+
 
+
      //Menu moveto container on item click functionallity
+
      $('.menu-item').on('click', function(){
+
          $('.menu-item').removeClass('subselected');
+
          $(this).addClass('subselected');
+
          if($(this).attr("data")=="#top"){
+
              $('html, body').animate({
+
                  scrollTop: 0
+
              }, 1000);
+
          }else{
+
              $('html, body').animate({
+
                  scrollTop: $($(this).attr("data")).offset().top-70
+
              }, 1000);
+
          }
+
      });
+
 
+
      //Hover of team members
+
      $('.team-member-container').on('mouseenter', function(){
+
        $(this).children('.team-member-photo').attr("style", "background-image:url('"+$(this).attr("hover")+"');");
+
        $(this).on('mouseleave', function(){
+
          $(this).children('.team-member-photo').attr('style', "background-image:url('"+$(this).attr("data")+"');");
+
        });
+
      });
+
 
+
    });
+
   
+
  </script>
+
 
+
  <style>
+
  
  
Line 73: Line 12:
  
  
    body,
+
#page {
    html{
+
width : 80%;  
      margin: 0;
+
      padding:0;
+
                    margin-left : 10%;
      font-family: font-family: 'Yanone Kaffeesatz', sans-serif;
+
                     
    }
+
 +
                     
  
    /* REMOVE UNWANTED ELEMENTS AND STYLE OTHERS */
+
}
    .firstHeading{
+
      display:none;
+
    }
+
    #top-section{
+
      background:#48af5d;
+
      margin-left:0 !important;
+
      width:100%;
+
      left:0;
+
    }
+
  
  
    /* LOADING SCREEN */
 
    .loading{
 
      position:fixed;
 
      width:100%;
 
      height:100%;
 
      top:0;
 
      left:0;
 
  
      z-index:5;
+
              #express{
 +
/*background-image : url("https://static.igem.org/mediawiki/2016/2/27/T--Sydney_Australia--1.png"); */
 +
 +
                        background-size:contain;
 +
                        background-position:center;
 +
                      background-position: 50% 50%;
 +
                          margin-left : 0%;
 +
width : 100%;
 +
height : 350px;
 +
background-size : cover;
 +
vertical-align : middle;
 +
line-height : 300px;
 +
text-align : center;
 +
display: flex;
 +
justify-content: center;
 +
                        vertical-align : center;
 +
align-items: center;
 +
-webkit-display: flex;
 +
-webkit-justify-content: center;
 +
-webkit-align-items: center;
 +
}
 +
 
  
      background-color:#555;
+
             
      color:#fff;
+
      text-align: center;
+
    }
+
    .loading p{
+
      position: relative;
+
      width:100%;
+
      height:10%;
+
      top:45%;
+
      left:0;
+
    }
+
  
    /* MENU STYLING */
+
.leadingQuestions { /* Projects */
    .menu{
+
                     
      position:fixed;
+
                        width : 100%;  
      width:100%;
+
height : 300px;
      height:56px;
+
                        background-color: yellow;
      top:14px;
+
                        float:left;
      background-color: #47a3da;
+
 
 +
}
  
      z-index:4;
+
.box2 { /* Projects */
 +
                     
 +
                        width : 50%;
 +
height : 360px;
 +
                      /* background-color: red;*/
 +
                        float:left;
 +
 
 +
}
 +
  
      border-collapse: collapse;
 
      text-align:center;
 
    }
 
    .menu tr td{
 
      text-align: center;
 
      vertical-align: middle;
 
  
      font-weight: 700;
+
.infobox {
      font-size:16px;
+
width : 50px;  
      color:#fff;
+
height : 100%
      width:7%;
+
                        background-color: yellow;
    }
+
                     
    .menu tr td.menu-item:hover{
+
      background-color:#258ecd;
+
                     
      cursor: pointer;
+
    }
+
    .subselected{
+
      background-color: #258ecd;
+
    }
+
  
    /* CONTAINERS STYLING */
+
}
    .container{
+
      position:relative;
+
      width:100%;
+
      top:50px;
+
    }
+
    .container .subcontainer{
+
      position:absolute;
+
      width:95%;
+
      height:90%;
+
      top:5%;
+
      left:2.5%;
+
    }
+
    #top{
+
      background-size: cover;
+
   
+
      overflow:hidden;
+
    }
+
  
    /* TEAM MEMBERS CARDS STYLING */
 
    .team-member-container{
 
      position:relative;
 
      width:14%;
 
      margin-left:2.28%;
 
  
      float:left;
+
.subpanel2 { /* Projects */
    }
+
 
    .team-member-container:hover{
+
    background-image : url("https://static.igem.org/mediawiki/2016/1/1d/T--Sydney_Australia--5.png");
      cursor:pointer;
+
    }
+
    background-position: center top;
    .row2{
+
    background-size: 100% 120px;
      top:4%;
+
     float:left;
    }
+
    width:100%;
    .team-member-container .team-member-photo{
+
    height:33.3%;
      position:relative;
+
    font-size:22px;
      width:100%;
+
    text-align:center;
      height:85%;
+
    margin-top:0;  
      top:0;
+
    margin-right:11px;
      left:0;
+
    border-radius:7px;
      background-size: cover;
+
    overflow:hidden;
     }
+
    line-height:10px;
    .team-member-container .team-member-footer{
+
    left-margin: 2000px
      position:relative;
+
      width:100%;
+
      height:15%;
+
      top:0;
+
      left:0;
+
 
+
      border:none;
+
      border-collapse: collapse;
+
      background-color: #47a3da;
+
      color:#fff;
+
 
+
      text-align: center;
+
      vertical-align: middle;
+
    }
+
 
+
body {
+
    padding-top: 110px;
+
 
}
 
}
 
+
.subpanel2:hover{
.center-block {
+
  display: block;
+
                        background-image : url("https://static.igem.org/mediawiki/2016/a/aa/T--Sydney_Australia--6.png");
  margin-left: auto;
+
background-position: center top;
  margin-right: auto;
+
    background-size: 100% 120px;
 +
    font-weight:bold;
 
}
 
}
  
  
.navbar-fixed-top {
+
.subpanel2:hover .narrowimg {
background: #fff;
+
    opacity:0.8;
filter: none !important;
+
    filter: alpha(opacity=80);
box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
}
-moz-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
-webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
+
        border-bottom: 1px solid rgba(0,0,0,0.2);
+
  
 +
.subpanel22 { /* Projects */
 +
 
 +
    background-image : url("https://static.igem.org/mediawiki/2016/2/27/T--Sydney_Australia--1.png");
 +
 +
    background-position: center top;
 +
    background-size: 100% 120px ;
 +
    float:left;
 +
    width:100%;
 +
    height:33.3%;
 +
    font-size:22px;
 +
    text-align:center;
 +
    margin-top:0;
 +
    margin-right:11px;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
    line-height:10px;
 +
    left-margin: 2000px
 +
}
 +
.subpanel22:hover{
 +
 +
                        background-image : url("https://static.igem.org/mediawiki/2016/5/5b/T--Sydney_Australia--2.png");
 +
background-position: center top;
 +
    background-size: 100% 120px ;
 +
    font-weight:bold;
 +
}
 +
.subpanel22:hover .narrowimg {
 +
    opacity:0.8;
 +
    filter: alpha(opacity=80);
 
}
 
}
  
 +
.subpanel23 { /* Projects */
 +
 
 +
    background-image : url("https://static.igem.org/mediawiki/2016/3/3b/T--Sydney_Australia--3.png");
 +
 +
    background-position: center top;
 +
    background-size: 100% 120px ;
 +
    float:left;
 +
  width:100%;
 +
    height:33.3%;
 +
      font-size:22px;
 +
    text-align:center;
 +
    margin-top:0;
 +
    margin-right:11px;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
    line-height:10px;
 +
    left-margin: 2000px
  
.dropdown-submenu {
 
    position: relative;
 
 
}
 
}
 
+
.subpanel23:hover{
.dropdown-submenu>.dropdown-menu {
+
    top: 0;
+
                        background-image : url("https://static.igem.org/mediawiki/2016/8/8b/T--Sydney_Australia--4.png");
    left: 100%;
+
background-position: center top;
    margin-top: -6px;
+
     background-size: 100% 120px;
    margin-left: -1px;
+
     font-weight:bold;
    -webkit-border-radius: 0 6px 6px 6px;
+
     -moz-border-radius: 0 6px 6px;
+
     border-radius: 0 6px 6px 6px;
+
 
}
 
}
 
+
.subpanel23:hover .narrowimg {
.dropdown-submenu:hover>.dropdown-menu {
+
     opacity:0.8;
     display: block;
+
    filter: alpha(opacity=80);
 
}
 
}
  
.dropdown-submenu>a:after {
+
.subpanel6 { /* Collaboration, SensiGEM */
     display: block;
+
     height:240.5px;
     content: " ";
+
     margin:0;
    float: right;
+
     margin-bottom:11px;
    width: 0;
+
     border-radius:7px;
     height: 0;
+
     overflow:hidden;
     border-color: transparent;
+
     background:rgb(255,255,255);  
     border-style: solid;
+
     color:Black;
     border-width: 5px 0 5px 5px;
+
     text-align:center;
     border-left-color: #ccc;
+
     margin-top: 5px;
+
    margin-right: -10px;
+
 
}
 
}
 
+
.subpanel6:hover{
.dropdown-submenu:hover>a:after {
+
     font-weight:bold;
     border-left-color: #fff;
+
 
}
 
}
 
+
.subpanel6:hover .narrowimg {
.dropdown-submenu.pull-left {
+
     opacity:0.8;
     float: none;
+
    filter: alpha(opacity=80);
 
}
 
}
  
.dropdown-submenu.pull-left>.dropdown-menu {
 
    left: -100%;
 
    margin-left: 10px;
 
    -webkit-border-radius: 6px 0 6px 6px;
 
    -moz-border-radius: 6px 0 6px 6px;
 
    border-radius: 6px 0 6px 6px;
 
  
  
  
.faceBot{
 
  background: #202020;
 
}
 
  
@font-face {
+
.mainLinks { /* Main */
  font-family: 'Open Sans', Arial;;
+
                        float:left;
}
+
                        width : 30%;
 
+
height : 150px;
body
+
                        border-radius: 8px;
{
+
                        margin-left: 1.53%;
    font-family: 'Open Sans', Arial;
+
                        margin-right: 1.53%;
 +
                        margin-top: 20px;
 +
                        background-color: red;
 +
                        float:left;
 +
                            text-align:center;
 +
                          font-size:26px;
 +
 
 
}
 
}
  
ul.nav a{
+
.mainLinks:hover{
  color: gray;
+
background-color:black;
  background-color: transparent;
+
  height: 100%;
+
  position: relative;
+
 
}
 
}
  
ul.nav a:hover{
+
.subLinks { /* Main */
  color: gray;
+
                        float:left;
  background-color: transparent;
+
                        width : 40%;
  height: 100%;
+
height : 150px;
  position: relative;
+
                        border-radius: 8px;
}
+
                        margin-left: 5%;
 +
                        margin-right: 5%;
 +
                        margin-top: 20px;
 +
                        background-color: red;
 +
                        float:left;
 +
                            text-align:center;
 +
                          font-size:26px;
 +
                     
  
h2 {
+
           
  color:green;
+
display: flex;
 +
justify-content: center;
 +
                        vertical-align : center;
 +
align-items: center;
 +
-webkit-display: flex;
 +
-webkit-justify-content: center;
 +
-webkit-align-items: center;
 +
 
 
}
 
}
  
h4 {
+
.subLinks:hover{
    font-weight: bold;
+
background-color:black;
 
}
 
}
  
.menu-item{
+
.separationFine {
  height: 75px;
+
width: 100%;
 +
height:10px;
 
}
 
}
  
li.menu-item{
+
.boxLeft { /* Projects */
  background: transparent !important;
+
                     
 +
                        width : 45%;  
 +
display: inline
 +
                    margin-left: 2.5%;
 +
                    margin-right: 2.5%;
 +
                        float:left;
 +
 
 
}
 
}
 
+
.boxRight { /* Projects */
 
+
                     
 
+
                        width : 45%;  
.green-effect{
+
display: inline
  display: none;
+
                    margin-right: 2.5%;
  background-color: #4AAF51;
+
                    margin-left : 2.5%;
  opacity: 1;
+
                        float:left;
  color: #FFF;
+
    
  transition-property: all;
+
  transition-duration: 0.3s;
+
  transition-timing-function: ease-out;
+
  transition-delay: 0s;
+
  border-color: #288D30;
+
  position: absolute;
+
  bottom: 0px;
+
  width: 100%;
+
  height: 2px;
+
   right: 0px;
+
 
}
 
}
 +
.boxAll {
 +
clear: both;
 +
width: 100%
  
.logo {
 
margin-top: 100px;
 
  
 +
height: 10px;
 
}
 
}
  
a:hover .green-effect{
 
  display: inherit;
 
}
 
  
.invertir:hover {
+
.hide-bullets {
  -webkit-filter: invert(100%);
+
    list-style:none;
 +
    margin-left: -40px;
 +
    margin-top:20px;
 
}
 
}
 
dropdown-toggle {
 
width: 10%;
 
 
 
 
 
}
 
 
 
</style>
 
 
 
</head>
 
 
<body>
 
 
 
<div class="navbar navbar-fixed-top" style="margin-top:15px">
 
  <nav class="navbar-inner">
 
 
 
  <div class="row-sm-height">
 
 
 
  <div class="col-sm-2"><a href="https://2017.igem.org/Team:UCSC"><img class="logo" src="https://static.igem.org/mediawiki/2017/d/d4/Logo_edit_new.png" height="60"  width="auto" ></a></div>
 
  
  
  
 +
.thumbnail {
 +
    padding: 0;
  
  
 
   
 
   
 +
}
  
  <div class="col-md-10" >
+
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
      <ul class="nav navbar-nav" style="margin-top:10px">
+
    width: 100%;
    <li>
+
    outline: 0;
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
}
  
                Team<b class="caret"></b>           
 
</a>
 
                    <ul class="dropdown-menu multi-level">
 
                        <li><a href="https://2017.igem.org/Team:UCSC/Team">Meet the Team </a></li>
 
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Attributions">Attributions </a></li>
 
                   
 
                    </ul>
 
                </li>
 
  
 +
</style>
 +
  
 +
<div class="container" >
 +
        <div id="main_area" style = "margin-top: -50px;">
 +
                <!-- Slider -->
 +
                <div class="row">
 +
                    <div class="col-xs-12" id="slider">
 +
                        <!-- Top part of the slider -->
 +
                        <div class="row">
 +
                            <div class="col-sm-8" id="carousel-bounding-box" style = "margin-left: 17.5%;">
 +
                                <div class="carousel slide" id="myCarousel">
 +
                                    <!-- Carousel items -->
 +
                                    <div class="carousel-inner">
 +
                                        <div class="active item" data-slide-number="0">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/b/b9/T--Sydney_Australia--claudiabanner.jpg "></div>
  
<li>
+
                                        <div class="item" data-slide-number="1">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Project <b class="caret"></b></a>
+
                                        <img src="https://static.igem.org/mediawiki/2016/6/62/T--Sydney_Australia--sholtobanner.png"></div>
                    <ul class="dropdown-menu multi-level"  >
+
+
<li><a href="https://2016.igem.org/Team:Sydney_Australia/ProjectHome">Project- Home</a></li>
+
<li class="divider"></li>
+
              <li><a href="https://2016.igem.org/Team:Sydney_Australia/Safety">Safety</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Sense">Sense</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Express">Express</a></li>
+
             
+
                 
+
                        <li class="dropdown-submenu">
+
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Keep Fresh</a>
+
                            <ul class="dropdown-menu">
+
                                <li><a href="https://2016.igem.org/Team:Sydney_Australia/Design">Applied Design</a></li>
+
                             
+
                                <li><a href="https://2016.igem.org/Team:Sydney_Australia/Entrepreneurship">Business Plan</a></li>
+
                            </ul>
+
                        </li>
+
  
                          <li><a href="https://2016.igem.org/Team:Sydney_Australia/Notebook">Notebook</a></li>
+
                                        <div class="item" data-slide-number="2">
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Interlab">Interlab</a></li>
+
                                        <img src="https://static.igem.org/mediawiki/2016/c/c7/T--Sydney_Australia--AmandaBio.png"></div>
<li><a href=" https://2016.igem.org/Team:Sydney_Australia/Protocols">Protocols</a></li>
+
                    </ul>
+
  
 +
                                        <div class="item" data-slide-number="3">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/4/45/T--Sydney_Australia--Liam.png
 +
"></div>
  
                </li>
+
                                        <div class="item" data-slide-number="4">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/8/89/T--Sydney_Australia--Singyoung.png " ></div>
  
 +
                                        <div class="item" data-slide-number="5">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/4/40/T--Sydney_Australia--orionbanner.jpg"></div>
  
 +
<div class="active item" data-slide-number="6">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/1/11/T--Sydney_Australia--almabanner.png"></div>
  
 +
                                        <div class="item" data-slide-number="7">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/f/ff/T--Sydney_Australia--themathguy.png"></div>
  
 +
                                   
  
     
+
                                        <div class="item" data-slide-number="8">
 +
                                        <img src="https://static.igem.org/mediawiki/2016/0/0a/T--Sydney_Australia--TeamBanner.jpeg"></div>
  
  
        <li>
 
    <a href="https://2016.igem.org/Team:Sydney_Australia/Human_Practices" class="dropdown-toggle" data-toggle="dropdown">
 
  
                Human Practices<b class="caret"></b>           
 
</a>
 
                    <ul class="dropdown-menu multi-level">
 
<li><a href="https://2016.igem.org/Team:Sydney_Australia/Human_Practices">Human Practices - Summary</a></li>
 
<li class="divider"></li>
 
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Integrated_Practices">Integrated Human Practices</a></li>
 
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Engagement">Outreach</a></li>
 
<li><a href="https://2016.igem.org/Team:Sydney_Australia/TOK">Theory of Knowledge</a></li>
 
                     
 
                    </ul>
 
                </li>
 
  
  
        <li class="menu-item">
+
                                    </div><!-- Carousel nav -->
          <a href="https://2016.igem.org/Team:Sydney_Australia/Collaboration">
+
                                    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span>Collaboration</span>
+
                                        <span class="glyphicon glyphicon-chevron-left"></span>                                      
            <span class="green-effect"></span>
+
                                    </a>
          </a>
+
                                    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
</li>
+
                                        <span class="glyphicon glyphicon-chevron-right"></span>                                      
 +
                                    </a>                               
 +
                                    </div>
 +
                            </div>
  
   
+
                           
  
+
                           
 +
                        </div>
 +
                    </div>
 +
                </div><!--/Slider-->
 +
<div class = "separationFine"> </div>
 +
                <div class="row hidden-xs" id="slider-thumbs" >
 +
                        <!-- Bottom switcher of slider -->
 +
                        <ul class="hide-bullets" >
 +
                            <li class="col-sm-3">
 +
                                <a class="thumbnail" id="carousel-selector-0" style = "height: 20px;"><img src="https://static.igem.org/mediawiki/2016/a/aa/T--Sydney_Australia--claudiaface.jpg" > </a>
 +
                            </li>
  
                <li>
+
                            <li class="col-sm-3">
             
+
                                <a class="thumbnail" id="carousel-selector-1"><img src="https://static.igem.org/mediawiki/2016/3/39/T--Sydney_Australia--SholtoHead.png"  ></a>
 +
                            </li>
  
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
                            <li class="col-sm-3">
 +
                                <a class="thumbnail" id="carousel-selector-2"><img src="https://static.igem.org/mediawiki/2016/8/8b/T--Sydney_Australia--amandaface.jpg" ></a>
 +
                            </li>
  
                Modelling <b class="caret"></b>           
+
                            <li class="col-sm-3">
</a>
+
                                <a class="thumbnail" id="carousel-selector-3"><img src="https://static.igem.org/mediawiki/2016/0/0c/T--Sydney_Australia--liamface.jpg" ></a>
                    <ul class="dropdown-menu multi-level">
+
                            </li>
                          <li><a href="https://2016.igem.org/Team:Sydney_Australia/Model">Modelling - Home</a></li>
+
<li class="divider"></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/ProteinModel1">Protein Modelling <br> Etnr1</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/ProteinModel2">Protein Modelling <br> Etnr2</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/InternalCellular">Internal Cellular Model</a></li>
+
                       
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/MacroscopicDiffusion">Macroscopic Diffusion Model</a></li>
+
                     
+
                     
+
                    </ul>
+
                </li>
+
  
      <li>
+
                        </ul> </div>
 +
<div class="row hidden-xs" id="slider-thumbs" >
 +
<ul class="hide-bullets" >
 +
                                    <li class="col-sm-3">
 +
                                <a class="thumbnail" id="carousel-selector-4"><img src="https://static.igem.org/mediawiki/2016/0/0c/T--Sydney_Australia--singyoungface.jpg" ></a>
 +
                            </li>
  
  <li>
+
                            <li class="col-sm-3">
             
+
                                <a class="thumbnail" id="carousel-selector-5"><img src="https://static.igem.org/mediawiki/2016/1/18/T--Sydney_Australia--orionface.jpg" ></a>
 
+
                            </li>  
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
                              <li class="col-sm-3">
 
+
                                <a class="thumbnail" id="carousel-selector-6"><img src="https://static.igem.org/mediawiki/2016/9/9f/T--Sydney_Australia--almaface.jpg" ></a>
                Software <b class="caret"></b>           
+
                            </li>
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                      <li><a href="https://2016.igem.org/Team:Sydney_Australia/Software">Software - Home</a></li>
+
<li class="divider"></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Primers">Primer Design App</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/SmartPhone">SmartPhone App </a></li>
+
                     
+
                     
+
                     
+
                    </ul>
+
                </li>
+
 
+
  <li>
+
    <a href="https://2016.igem.org/Team:Sydney_Australia/Achievements" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Achievements<b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Parts"> Parts</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Medals">Medals</a></li>
+
  
 +
                            <li class="col-sm-3">
 +
                                <a class="thumbnail" id="carousel-selector-7"><img src="https://static.igem.org/mediawiki/2016/7/74/T--Sydney_Australia--wunnaface.jpg" ></a>
 +
                            </li>
 
                      
 
                      
                    </ul>
+
                 
                 </li>
+
                        </ul>                
 
+
                 </div>
 
+
        </div>
 
+
      </ul>
+
</div>
+
  </nav>
+
 
</div>
 
</div>
  
Line 517: Line 408:
  
  
<div class="column full_size" >
 
  
<h1>Team</h1>
 
<p>In this page you can introduce your team members, instructors, and advisors. </p>
 
</div>
 
  
<div class="clear"></div>
+
<script>     jQuery(document).ready(function($) {
 +
 +
        $('#myCarousel').carousel(8);
  
<div class="column half_size" >
 
<h5>Inspiration</h5>
 
<p>You can look at what other teams did to get some inspiration! <br />
 
Here are a few examples:</p>
 
<ul>
 
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">METU Turkey </a></li>
 
<li><a href="https://2014.igem.org/Team:Colombia/Members">Colombia</a></li>
 
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
 
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
 
</ul>
 
  
</div>
+
        $('#myCarousel').carousel({
 +
                interval: 100000
 +
        });
 +
  
<div class="column half_size" >
 
<h5>What should this page contain?</h5>
 
<ul>
 
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
 
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
 
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
 
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
 
</ul>
 
</div>
 
  
 +
        $('#carousel-text').html($('#slide-content-4').html());
 +
 +
        //Handles the carousel thumbnails
 +
      $('[id^=carousel-selector-]').click( function(){
 +
            var id = this.id.substr(this.id.lastIndexOf("-") + 1);
 +
            var id = parseInt(id);
 +
            $('#myCarousel').carousel(id);
 +
        });
 +
 +
 +
        // When the carousel slides, auto update the text
 +
        $('#myCarousel').on('slid.bs.carousel', function (e) {
 +
                var id = $('.item.active').data('slide-number');
 +
                $('#carousel-text').html($('#slide-content-'+id).html());
 +
        });
 +
});
 +
</script>
  
 
</div>
 
 
</html>
 
</html>

Revision as of 00:12, 20 July 2017