Team:Penn

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
   <head>
   <head>
-
     <title>Home</title>
+
     <title>Team</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <!-- Bootstrap -->
     <!-- Bootstrap -->
     <link href="https://googledrive.com/host/0B4ZBZOYYKBzEeUFaR1lNWFZWMnc" rel="stylesheet" media="screen">
     <link href="https://googledrive.com/host/0B4ZBZOYYKBzEeUFaR1lNWFZWMnc" rel="stylesheet" media="screen">
         <link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/>
         <link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/>
-
        <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
 
-
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
 
-
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEOFVQV0ZLWEZqN2M"></script>
 
      
      
Line 16: Line 13:
             text-align: left;
             text-align: left;
         }
         }
-
     
+
       
-
 
+
       
-
  /* CUSTOMIZE THE CAROUSEL
+
       
-
    -------------------------------------------------- */
+
/*Brady Bunch Table*/
-
 
+
.team {
-
 
+
       float: center;
-
 
+
       margin: auto;
-
    .carousel-control {
+
-
       height: 80px;
+
-
       margin-top: 0;
+
-
      font-size: 75px;
+
-
      text-shadow: 0 1px 1px rgba(0,0,0,.4);
+
-
      background-color: transparent;
+
-
      border: 0;
+
-
      z-index: 10;
+
-
color: rgb(200,200,200);
+
-
    }
+
-
/*
+
      
      
-
.carousel img {
 
-
  min-width: 100%;
 
}
}
-
 
 
-
 
 
-
    .carousel-caption {
 
-
      background-color: rgba(0,0,0,.3);
 
-
    }
 
-
   
 
-
    .carousel-caption h1,
 
-
    .carousel-caption .lead {
 
-
      margin: 0;
 
-
      line-height: 1.25;
 
-
      color: #fff;
 
-
      text-shadow: 0 1px 1px rgba(0,0,0,.4);
 
-
    }*/
 
-
   
 
-
    #main_area{
 
-
      margin: 100px 150px 10px 150px;
 
-
     
 
-
    }
 
-
#myCarousel {
+
.team td {
-
  width: 80%;
+
    overflow: hidden;
-
}
+
            height:175px;
 +
            width:220px;
 +
            display: inline-block;
 +
            padding:5px;
 +
            margin: 3px;
 +
            background-color: #721a35;
 +
            margin: 2px;
      
      
-
 
+
        }
-
.item {
+
       
-
  height: 300px;
+
        .hidden { /*change this class when hovered*/
-
   overflow: hidden;
+
            display: none;
 +
        }
 +
        .team img {
 +
          max-width:100%;
 +
    max-height:100%;
 +
    background-color: #721a35;
 +
        }
 +
       
 +
.name {
 +
    margin-top:-5px;
 +
    margin-left: -5px;
 +
    padding:5px;
 +
    width: 220px;
 +
    height: 175px;
 +
    display: none;
 +
    background-color: #721a35;
 +
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 +
   filter: alpha(opacity=80);
 +
-moz-opacity: 0.8;
 +
-khtml-opacity: 0.8;
 +
  opacity: 0.8;
}
}
-
.span2 {
+
#center:hover {
-
  overflow: hidden;
+
    cursor: auto;
-
  height: 80px;
+
    -moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=0, Color='#444444')";
 +
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=0, Color='#444444');
 +
   
}
}
-
 
+
h4 {
-
.thumbnail {
+
    text-align: center;
-
overflow: hidden;
+
    font-size: 16px;
 +
    color: black;
}
}
-
/*Position/size hero unit*/
 
-
.hero-unit {
 
-
    width: 375px;
 
-
margin-left: 20px;
 
-
margin-top: 10px;
 
-
padding-left: 75px;
 
-
padding:right: 100px;
 
-
padding-bottom: 20px;
 
-
text-align: left;
 
-
}
 
-
.textbox {
+
/*change the cursor to pointer (like when hovering a link) and add a box shadow*/
-
width: 200px;
+
td:hover {
-
float: left;
+
cursor:pointer;
 +
-moz-box-shadow: 4px 4px 4px #444;
 +
-webkit-box-shadow: 4px 4px 4px #444;
 +
box-shadow: 4px 4px 4px #444;
 +
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";
 +
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444');
}
}
-
 
+
/*Change color of big banner at the top*/
-
#logo {
+
-
  height: 45px;
+
-
  float: right;
+
-
  margin-right: -450px;
+
-
margin-top:-10px;
+
-
 
+
-
}
+
-
 
+
-
 
+
-
 
+
.jumbotron {
.jumbotron {
   position: relative;
   position: relative;
Line 109: Line 92:
   text-align: center;
   text-align: center;
   text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
   text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
-
   background: #020031; /* Old browsers */
+
   background: #721a35; /* Old browsers */
-
   background: -moz-linear-gradient(45deg,  #020031 0%, #6d3353 100%); /* FF3.6+ */
+
   background: -moz-linear-gradient(45deg,  #721a35 0%, #65003a 100%); /* FF3.6+ */
-
   background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#240080), color-stop(100%,#a8bbf4)); /* Chrome,Safari4+ */
+
   background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#721a35), color-stop(100%,#65003a)); /* Chrome,Safari4+ */
-
   background: -webkit-linear-gradient(45deg, #020031 0%,#a8bbf4 100%); /* Chrome10+,Safari5.1+ */
+
   background: -webkit-linear-gradient(45deg, #721a35 0%,#65003a 100%); /* Chrome10+,Safari5.1+ */
-
   background: -o-linear-gradient(45deg, #020031 0%,#a8bbf4 100%); /* Opera 11.10+ */
+
   background: -o-linear-gradient(45deg, #721a35 0%,#65003a 100%); /* Opera 11.10+ */
-
   background: -ms-linear-gradient(45deg,  #020031 0%,#a8bbf4 100%); /* IE10+ */
+
   background: -ms-linear-gradient(45deg,  #721a35 0%,#65003a 100%); /* IE10+ */
-
   background: linear-gradient(45deg, #020031 0%,#a8bbf4 100%); /* W3C */
+
   background: linear-gradient(45deg, #721a35 0%,#65003a 100%); /* W3C */
-
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
+
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#721a35', endColorstr='#65003a3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
   -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
   -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
     -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
     -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
Line 122: Line 105:
}
}
-
.footer {
+
/*add some height to jumbotron banner thing*/
-
width: 100%;
+
 
-
height: 15px;
+
.container {
-
padding: 5px;
+
min-height: 600px;
-
margin-top: 100px;
+
-
text-align: left;
+
-
background-color: black;
+
-
color: #FFFFFF;
+
}
}
 +
 +
 
     </style>
     </style>
   </head>
   </head>
Line 148: Line 129:
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
             </button>
             </button>
-
             <a class="brand" class="active" href="https://2013.igem.org/Team:Penn">Penn's iGEM Team</a>
+
             <a class="brand" href="https://2013.igem.org/Team:Penn">Penn's iGEM Team</a>
             <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
             <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
             <div class="nav-collapse collapse">
             <div class="nav-collapse collapse">
Line 157: Line 138:
                   <a href="#" class="dropdown-toggle" data-toggle="dropdown">About <b class="caret"></b></a>
                   <a href="#" class="dropdown-toggle" data-toggle="dropdown">About <b class="caret"></b></a>
                   <ul class="dropdown-menu">
                   <ul class="dropdown-menu">
-
                     <li><a href="https://2013.igem.org/Team:Penn/Team">Team</a></li>
+
                     <li><a id="team">Team</a></li>
                     <li><a href="https://2013.igem.org/Team:Penn/Sponsors">Sponsors</a></li>
                     <li><a href="https://2013.igem.org/Team:Penn/Sponsors">Sponsors</a></li>
                     <li><a href="https://igem.org/Team.cgi?id=1128">Official Team Profile</a></li>
                     <li><a href="https://igem.org/Team.cgi?id=1128">Official Team Profile</a></li>
Line 178: Line 159:
                   </ul>
                   </ul>
                 </li>
                 </li>
-
                <li><a href="http://2013.igem.or"><img id = "logo" src="https://static.igem.org/mediawiki/igem.org/1/17/IGEM_basic_Logo_white_stylized.png"></li></a>
 
               </ul>
               </ul>
             </div><!--/.nav-collapse -->
             </div><!--/.nav-collapse -->
Line 187: Line 167:
     </div><!-- /.navbar-wrapper -->
     </div><!-- /.navbar-wrapper -->
-
 
+
 
 +
 
     <!--Giant Image At the Top-->
     <!--Giant Image At the Top-->
     <div class="jumbotron masthead">
     <div class="jumbotron masthead">
   <div class="container">
   <div class="container">
-
  <!--<div class="hero-unit" id="text">
+
     <h1>Meet the Team</h1>
-
      <p><p>
+
     <p>Lorem ipsum dolor sit amet.</p>
-
    </div>-->
+
  </div>
-
     <h1>Penn's iGEM Page</h1>
+
-
     <p>is currently under construction.</p>
+
-
    <p>
+
-
</div>
+
</div>
</div>
 +
    <!--Team stuff-->
 +
<h2 style="text-align: center; margin-top: 200px;">Meet the Bunch</h2>
 +
<table class="team" cellpadding="5">
 +
    <tr>
 +
        <td>
 +
            <img id="flipbox" src="https://googledrive.com/host/0B4ZBZOYYKBzETDEzdFdSOC1ZVW8"/>
 +
            <div class="name"><h4>Name/Major</h4></div></td>
 +
       
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzETldtZHBxMTM3Ujg"/>
 +
            <div class="name"><h4>Josh Tycko<br/>Major:</h4></div></td>
 +
       
 +
     
 +
       
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzEU3VZUnNOdWFqYVE"/>
 +
            <div class="name"><h4>Danielle</h4></div></td>
 +
    </tr>
 +
    <tr>
 +
       
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzEZXRRMlRtODR2OVk/">
 +
                <div class="name"><h4>Daniel Cabrera<br/> Major:</h4></div></td>
 +
     
 +
        <td id="center"><h4><!--Center--></h4></td>
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzELXJ5NlFKUkJXRnc"/>
 +
            <div class="name"><h4>Mahamad Charawi<br/>Major:</h4></div></td>
 +
    </tr>
 +
    <tr>
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzERmpYczlyYU5TTUE"/>
 +
            <div class="name"><h4>Name/Major</h4></div>
 +
       
 +
          <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzEZ0tlUUViY2Z6Ymc"/>
 +
            <div class="name"><h4>Name/Major</h4></div></td>
 +
       
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzET2NBWmlOLVMtaVE">
 +
                <div class="name"><h4>Spencer</h4></div></td>
 +
    </tr>
 +
  </table>
 +
<h4 style="text-align: center">Photos by Erica Sachse</h4>
-
<!--CAROUSEL-->
+
   
-
 
+
    </div>
-
    <!-- Main Area -->
+
   
-
                <div id="main_area">
+
   
-
                        <!-- Slider -->
+
   
-
                        <div class="row">
+
   
-
                                <div class="span12" id="slider">
+
   
-
                                        <!-- Top part of the slider -->
+
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
-
                                        <div class="row">
+
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
-
                                                <div class="span8" id="carousel-bounding-box">
+
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEOFVQV0ZLWEZqN2M"></script></script>
-
                                                        <div id="myCarousel" class="carousel slide">
+
   
-
                                                                <!-- Carousel items -->
+
    <script src="../assets/js/jquery.js"></script>
-
                                                                <div class="carousel-inner">
+
    <script src="../assets/js/bootstrap-transition.js"></script>
-
                                                                        <div class="active item" data-slide-number="0"><img src="https://googledrive.com/host/0B4ZBZOYYKBzES3Jrc042WTlMR3c/" /></div>
+
    <script src="../assets/js/bootstrap-alert.js"></script>
-
                                                                        <div class="item" data-slide-number="1"><img src="https://googledrive.com/host/0B4ZBZOYYKBzEWHBpYXpOcFRBcGc/" /></div>
+
    <script src="../assets/js/bootstrap-modal.js"></script>
-
                                                                        <div class="item" data-slide-number="2"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/_mMloYB8xM/Discovery%20Day%20Clark%20Park/IMG_2061.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
    <script src="../assets/js/bootstrap-dropdown.js"></script>
-
                                                                        <div class="item" data-slide-number="3"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
    <script src="../assets/js/bootstrap-scrollspy.js"></script>
-
                                                                        <div class="item" data-slide-number="4"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/jtmF8YkJ_P/device%20photo.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
    <script src="../assets/js/bootstrap-tab.js"></script>
-
                                                                        <div class="item" data-slide-number="5"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/uN-wv6h07i/Unified%20Artwork%20Styles%20Here/science%21%21%21/20130513135201-0.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
    <script src="../assets/js/bootstrap-tooltip.js"></script>
-
                                                                </div>
+
    <script src="../assets/js/bootstrap-popover.js"></script>
-
                                                                <!-- Carousel nav -->
+
    <script src="../assets/js/bootstrap-button.js"></script>
-
                                                                <a class="carousel-control left" href="#myCarousel" data-slide="prev" font-size: 20px;>&#x276E; </a>
+
    <script src="../assets/js/bootstrap-collapse.js"></script>
-
                                                                <a class="carousel-control right" href="#myCarousel" data-slide="next"font-size: 20px;>&#x276F; </a>
+
    <script src="../assets/js/bootstrap-carousel.js"></script>
-
                                                        </div>
+
    <script src="../assets/js/bootstrap-typeahead.js"></script>
-
                                                </div>
+
    <script>
-
                                                <div class="span4" id="carousel-text"></div>
+
      !function ($) {
-
+
        $(function(){
-
                                                <div style="display: none;" id="slide-content">
+
          // carousel demo
-
                                                        <div id="slide-content-0">
+
          $('#myCarousel').carousel()
-
                                                                <h1>Hello and Welcome!</h1>
+
         
-
                                                      <p>Welcome to Penn's iGEM team wiki!  This wiki is currently under construction, but check
+
        $('html, body').animate({
-
                                                    back with us soon to learn more about what we're up to!</p> <a id="team" class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/Team">Meet the Team</a>
+
        scrollTop: $(".one").offset().top,
-
                                                        </div>
+
    }, '2400');
-
                                                        <div id="slide-content-1">
+
});
-
                                                                <h1>Project</h1>
+
   
-
              <p>This wiki is currently under construction, but check
+
      $("#two").click(function() {
-
              back with us soon to learn more about what we're up to!  Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+
         $('html, body').animate({
-
              <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/Project">Our Project</a>
+
        scrollTop: $(".two").offset().top,
-
                                                        </div>
+
    }, '2400');
-
                                                        <div id="slide-content-2">
+
  });
-
                                                                <h1>Outreach</h1>
+
     
-
              <p>Learn more about what Penn's iGEM team is doing in the community.  This wiki is currently under construction, but check
+
          $("#three, #team").click(function() {
-
              back with us soon to learn more about what we're up to! Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+
        $('html, body').animate({
-
              <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/HumanPractices">More Outreach</a>
+
        scrollTop: $(".team").offset().top,
-
                                                        </div>
+
    }, '2400');
-
                                                        <div id="slide-content-3">
+
  });
-
                                                                <h2>Slider Four</h2>
+
         
-
                                                                <p>Lorem Ipsum Dolor</p>
+
         /*  $(".team tr td").mouseenter(function(){
-
                                                                <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/HumanPractices">More</a>
+
          $(this).children(":first").toggleClass("hidden");
-
                                                        </div>
+
          $(this).children(":nth-child(2)").toggleClass("hidden");
-
                                                        <div id="slide-content-4">
+
         
-
                                                                <h2>Slider Five</h2>
+
         
-
                                                                <p>Lorem Ipsum Dolor</p>
+
          });
-
                                                            <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/Project">More</a>
+
         
-
                                                        </div>
+
          $(".team tr td").mouseenter(function(){
-
                                                        <div id="slide-content-5">
+
            $(this).children(":nth-child(3)").show();
-
                                                                <h2>Slider Six</h2>
+
            $(this).children(":nth-child(3)").animate({
-
                                                                <p>Lorem Ipsum Dolor</p>
+
                height: '50px',
-
                                                                  <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/">More</a>
+
                display: 'inline-block'
-
                                                        </div>
+
                });
-
                                                </div>
+
           
-
                                        </div>
+
            });
-
+
         
-
                                </div>
+
         
-
                        </div> <!--/Slider-->
+
          $(".team tr td").mouseleave(function(){
-
+
            $(this).children(":nth-child(2)").toggleClass("hidden");
-
                        <div class="row hidden-phone" id="slider-thumbs">
+
          $(this).children(":first").toggleClass("hidden");
-
                                <div class="span12">
+
          $(this).children(":nth-child(3)").css("height","0px");
-
                                        <!-- Bottom switcher of slider -->
+
          $(this).children(":nth-child(3)").hide();
-
                                        <ul class="thumbnails">
+
         
-
                                                <li class="span2">
+
            });*/
-
                                                        <a class="thumbnail" id="carousel-selector-0">
+
-
                                                                <img src="https://googledrive.com/host/0B4ZBZOYYKBzES3Jrc042WTlMR3c/" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-1">
+
-
                                                                <img src="https://googledrive.com/host/0B4ZBZOYYKBzEWHBpYXpOcFRBcGc/" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-2">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/_mMloYB8xM/Discovery%20Day%20Clark%20Park/IMG_2061.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-3">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-4">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/jtmF8YkJ_P/device%20photo.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-5">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/uN-wv6h07i/Unified%20Artwork%20Styles%20Here/science%21%21%21/20130513135201-0.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                        </ul>
+
-
                                </div>
+
-
                        </div>
+
-
</div>
+
-
 
+
-
 
+
-
<!--FOOTER-->
+
-
<div class="footer">
+
-
<p>Photos: Erica Sachse | Website: Stefanie Alfonso</p>
+
-
</div>
+
-
<script>
+
-
  jQuery(document).ready(function($) {
+
-
+
-
         $('#myCarousel').carousel({
+
-
                interval: 5000
+
-
        });
+
-
   
+
-
        $('#carousel-text').html($('#slide-content-0').html());
+
-
   
+
-
        //Handles the carousel thumbnails
+
-
         $('[id^=carousel-selector-]').click( function(){
+
-
                var id_selector = $(this).attr("id");
+
-
                var id = id_selector.substr(id_selector.length -1);
+
-
                var id = parseInt(id);
+
-
                $('#myCarousel').carousel(id);
+
-
        });
+
-
+
-
+
-
        // When the carousel slides, auto update the text
+
-
        $('#myCarousel').on('slid', function (e) {
+
-
                var id = $('.item.active').data('slide-number');
+
-
                $('#carousel-text').html($('#slide-content-'+id).html());
+
-
        });
+
-
+
-
+
-
});
+
-
</script>
+
      
      
      
      
 +
          $("td").click(function(){
 +
   
 +
    if ($(this).children("img").is(":visible")) {
 +
   
 +
            $(this).flip({direction: 'tb', content: $(this), color: '#721a35'
 +
            });
 +
            $(this).children("img").hide();
 +
                $(this).children(".name").show();
 +
             
 +
    }
      
      
 +
       
 +
          else {
 +
          $(this).flip({direction: 'tb', content: $(this), color: '#721a35' });
 +
                        $(this).children(".name").hide();
 +
                $(this).children("img").show();
 +
     
 +
           
 +
           
 +
          }
 +
            });
 +
         
 +
           
 +
       
 +
         
 +
         
 +
         
 +
      }(window.jQuery)
 +
    </script>
 +
    <script src="../assets/js/holder/holder.js"></script>
   </body>
   </body>
</html>
</html>

Revision as of 18:17, 29 July 2013

Team

Penn's iGEM Team

Meet the Team

Lorem ipsum dolor sit amet.

Meet the Bunch

Name/Major

Josh Tycko
Major:

Danielle

Daniel Cabrera
Major:

Mahamad Charawi
Major:

Name/Major

Name/Major

Spencer

Photos by Erica Sachse

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