Team:UESTC

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{Team:UESTC/hidden}}
 
-
{{Team:UESTC/header}}
 
<html>
<html>
-
<head>
+
<head>
-
<style type="text/css">
+
    <title>header</title>
-
/*
+
    <meta name="viewport" content="width=device-width, initial-scale=1">
-
* img responsive
+
    <!-- web fonts for the team name and navigation bar -->
-
*/
+
    <link href='http://fonts.googleapis.com/css?family=Marcellus+SC' rel='stylesheet' type='text/css'>
-
img{
+
    <script src="https://2013.igem.org/Team:UESTC/js/libs/modernizr-2.0.6.min.js?action=raw&ctype=text/javascript"></script>
-
max-width: 100%;
+
    <style type="text/css">
-
height: auto;
+
-
}
+
/*
/*
-
  * top style
+
  * logo and navigation style
  */
  */
-
#top{
+
#logo{
-
position: fixed;
+
position: relative;
-
right:0px;
+
width:16.667%; /* 200/1200 */
-
bottom: 0px;
+
left:0%;
-
z-index: 6;
+
top:-40px;
}
}
-
/*
+
#team_bg{
-
* slideshow style
+
position: relative;
-
*/
+
width:64.28%;   /* 900/1300*/
-
.container{
+
left: 16.667%; /* 200/1200 */
-
width:46.1538%;/* 600/1300 */
+
top:-190px;
-
height:auto;
+
-
margin: 0 auto;
+
}
}
-
  #slides {
+
#igem_logo{
-
      display: none;
+
position: relative;
-
     }
+
width: 19.307%;    /* 251/1300 */
 +
left:0%;
 +
top:0px;
 +
}
 +
nav{
 +
position:relative;
 +
z-index: 50;
 +
}
 +
.toggleMenu {
 +
    display:  none;
 +
    background: #666;
 +
    padding: 10px 15px;
 +
    color: #fff;
 +
    position: relative;
 +
    top: -50px;
 +
}
 +
.nav {
 +
    list-style: none;
 +
    *zoom: 1;
 +
    background:#335599;
 +
    border-radius:10px; /*some css3*/
 +
    -moz-border-radius:10px;
 +
    -webkit-border-radius:10px;
 +
    box-shadow:0 2px 2px rgba(0,0,0, .5);
 +
    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);
 +
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);
 +
    position:relative;
 +
    width:100%;
 +
    top: -50px;
 +
    left: 0%;
 +
}
 +
.nav:before,
 +
.nav:after {
 +
    content: " ";
 +
    display: block;
 +
}
 +
.nav:after {
 +
    clear: both;
 +
}
 +
.nav ul {
 +
    list-style: none;
 +
     width: 9em;
 +
}
 +
.nav a {
 +
    padding: 10px 15px;
 +
    color:#fff;
 +
    border-radius:10px; /*some css3*/
 +
    -moz-border-radius:10px;
 +
    -webkit-border-radius:10px;
 +
    text-shadow:0 2px 2px rgba(0,0,0, .7);
 +
}
 +
.nav .current a, .nav li:hover > a {
 +
    background:#7788aa url('https://static.igem.org/mediawiki/2013/1/12/UESTC_downArrow.png') repeat-x 0 -20px;
 +
    color:#000;
 +
    border-top:1px solid #f8f8f8;
-
     #slides .slidesjs-navigation {
+
     box-shadow:0 2px 2px rgba(0,0,0, .7); /*some css3*/
-
      margin-top:5px;
+
    -moz-box-shadow:0 2px 2px rgba(0,0,0, .7);
-
     }
+
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .7);
 +
    text-shadow:0 2px 2px rgba(255,255,255, 0.7);
 +
}
 +
.nav li {
 +
    position: relative;
 +
}
 +
.nav > li {
 +
    float: left;
 +
    border-top: 1px solid #335599;
 +
}
 +
.nav > li > .parent {
 +
    background-image: url('https://static.igem.org/mediawiki/2013/1/12/UESTC_downArrow.png');
 +
    background-repeat: no-repeat;
 +
    background-position: right;
 +
}
 +
.nav > li > a {
 +
    display: block;
 +
}
 +
.nav li  ul {
 +
    position: absolute;
 +
    left: -9999px;
 +
}
 +
.nav > li.hover > ul {
 +
    left: 0;
 +
}
 +
.nav li li.hover ul {
 +
    left: 100%;
 +
    top: 0;
 +
}
 +
.nav li li a {
 +
     display: block;
 +
    background: #335599;
 +
    position: relative;
 +
    z-index:100;
 +
    border-top: 1px solid #175e4c;
 +
}
 +
.nav li li li a {
 +
    background:#335599;
 +
    z-index:200;
 +
    border-top: 1px solid #1d7a62;
 +
}
 +
.nav ul li:first-child > a {
 +
    -moz-border-radius-topleft:10px; /*some css3*/
 +
    -moz-border-radius-topright:10px;
 +
    -webkit-border-top-left-radius:10px;
 +
    -webkit-border-top-right-radius:10px;
 +
}
 +
.nav ul li:last-child > a {
 +
    -moz-border-radius-bottomleft:10px; /*some css3*/
 +
    -moz-border-radius-bottomright:10px;
 +
    -webkit-border-bottom-left-radius:10px;
 +
    -webkit-border-bottom-right-radius:10px;
 +
}
 +
.nav ul {
 +
    padding:0;
 +
    width:170px;
 +
  background-color:#335599;
 +
    border:1px solid #7788aa;
-
     a.slidesjs-next,
+
     border-radius:10px; /*some css3*/
-
     a.slidesjs-previous,
+
     -moz-border-radius:10px;
-
     a.slidesjs-play,
+
     -webkit-border-radius:10px;
-
     a.slidesjs-stop {
+
     box-shadow:0 2px 2px rgba(0,0,0, .5);
-
      background-image: url("https://static.igem.org/mediawiki/2013/f/f9/UESTC_btns-next-prev.png");
+
    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);
-
      background-repeat: no-repeat;
+
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);
-
      display:block;
+
-
      width:12px;
+
-
      height:18px;
+
-
      overflow: hidden;
+
-
      text-indent: -9999px;
+
-
      float: left;
+
-
      margin-right:5px;
+
-
    }
+
-
     a.slidesjs-next {
+
     -moz-transition:opacity .25s linear, visibility .1s linear .1s;
-
      margin-right:10px;
+
    -webkit-transition:opacity .25s linear, visibility .1s linear .1s;
-
      background-position: -12px 0;
+
    -o-transition:opacity .25s linear, visibility .1s linear .1s;
 +
    transition:opacity .25s linear, visibility .1s linear .1s;
 +
}
 +
/*
 +
* media query for responsible drop menu
 +
*/
 +
@media screen and (max-width: 768px) {
 +
    .active {
 +
        display: block;
     }
     }
-
 
+
     .nav > li {
-
     a:hover.slidesjs-next {
+
        float: none;
-
      background-position: -12px -18px;
+
     }
     }
-
 
+
     .nav > li > .parent {
-
     a.slidesjs-previous {
+
        background-position: 95% 50%;
-
      background-position: 0 0;
+
     }
     }
-
 
+
     .nav li li .parent {
-
     a:hover.slidesjs-previous {
+
        background-image: url('https://static.igem.org/mediawiki/2013/1/12/UESTC_downArrow.png');
-
      background-position: 0 -18px;
+
        background-repeat: no-repeat;
 +
        background-position: 95% 50%;
     }
     }
-
 
+
     .nav ul {
-
     a.slidesjs-play {
+
        display: block;
-
      width:15px;
+
        width: 100%;
-
      background-position: -25px 0;
+
     }
     }
-
 
+
  .nav > li.hover > ul , .nav li li.hover ul {
-
    a:hover.slidesjs-play {
+
        position: static;
-
      background-position: -25px -18px;
+
     }
     }
-
     a.slidesjs-stop {
+
}
-
      width:18px;
+
     </style>
-
      background-position: -41px 0;
+
     <script type="text/javascript">
-
     }
+
-
     a:hover.slidesjs-stop {
+
     var _gaq = _gaq || [];
-
      background-position: -41px -18px;
+
    _gaq.push(['_setAccount', 'UA-36212355-2']);
-
     }
+
     _gaq.push(['_trackPageview']);
-
     .slidesjs-pagination {
+
     (function() {
-
      margin: 7px 0 0;
+
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-
      float: right;
+
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-
      list-style: none;
+
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-
    }
+
        })();
 +
 +
var ww = document.body.clientWidth;
-
    .slidesjs-pagination li {
+
$(document).ready(function() {
-
      float: left;
+
$(".nav li a").each(function() {
-
      margin: 0 1px;
+
if ($(this).next().length > 0) {
-
    }
+
$(this).addClass("parent");
 +
};
 +
})
 +
 +
$(".toggleMenu").click(function(e) {
 +
e.preventDefault();
 +
$(this).toggleClass("active");
 +
$(".nav").toggle();
 +
});
 +
adjustMenu();
 +
})
-
    .slidesjs-pagination li a {
+
$(window).bind('resize orientationchange', function() {
-
      display: block;
+
ww = document.body.clientWidth;
-
      width: 13px;
+
adjustMenu();
-
      height: 0;
+
});
-
      padding-top: 13px;
+
-
      background-image: url("https://static.igem.org/mediawiki/2013/0/0f/UESTC_pagination.png");
+
-
      background-position: 0 0;
+
-
      float: left;
+
-
      overflow: hidden;
+
-
    }
+
-
    .slidesjs-pagination li a.active,
+
var adjustMenu = function() {
-
    .slidesjs-pagination li a:hover.active {
+
if (ww < 768) {
-
      background-position: 0 -13px
+
$(".toggleMenu").css("display", "inline-block");
-
    }
+
if (!$(".toggleMenu").hasClass("active")) {
 +
$(".nav").hide();
 +
} else {
 +
$(".nav").show();
 +
}
 +
$(".nav li").unbind('mouseenter mouseleave');
 +
$(".nav li a.parent").unbind('click').bind('click', function(e) {
 +
// must be attached to anchor element to prevent bubbling
 +
e.preventDefault();
 +
$(this).parent("li").toggleClass("hover");
 +
});
 +
}
 +
else if (ww >= 768) {
 +
$(".toggleMenu").css("display", "none");
 +
$(".nav").show();
 +
$(".nav li").removeClass("hover");
 +
$(".nav li a").unbind('click');
 +
$(".nav li").unbind('mouseenter mouseleave').bind('mouseenter mouseleave', function() {
 +
// must be attached to li so that mouseleave is not triggered when hover over submenu
 +
$(this).toggleClass('hover');
 +
});
 +
}
 +
}
-
    .slidesjs-pagination li a:hover {
 
-
      background-position: 0 -26px
 
-
    }
 
-
     #slides a:link,
+
     </script>
-
    #slides a:visited {
+
-
      color: #333
+
-
    }
+
-
    #slides a:hover,
+
</head>
-
    #slides a:active {
+
<!--header-->
-
      color: #9e2020
+
<body>
-
    }
+
<div id="experiment">
 +
    <div id="background"></div>
 +
</div>
 +
 +
<div id="logo"><img src="https://static.igem.org/mediawiki/2013/7/70/Uestc_logo.png"/></div>
 +
<div id="team_bg"><img src="https://static.igem.org/mediawiki/2013/d/d6/UESTC_teambg.jpg" /></div>
 +
<div id="igem_logo"><img src="https://static.igem.org/mediawiki/2013/3/3e/UESTC_igemlogo.png" /></div>
 +
<nav>
 +
  <a class="toggleMenu" href="#">Menu</a>
 +
  <ul class="nav">
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC">Home</a>
 +
</li>
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC/team_info.html">Team Info</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:UESTC/team_info.html#greeting">Greetings</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/team_info.html#member">Member</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/team_info.html#contact">Contact Us</a></li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC/project.html">Project</a>
 +
    <ul>
 +
    <li><a href="https://2013.igem.org/Team:UESTC/project.html#overview">Overview</a></li>
 +
    <li>
 +
<a href="https://2013.igem.org/Team:UESTC/Attributions.html">Attributions</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:UESTC/Attributions.html#Academic Reference">Academic Reference</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/Attributions.html#Material Source">Material Source</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#project1">Blueprinting</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#project2">Transpeeder</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#project3">iBiobrick</a></li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC/project.html">Notebook</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#minutes">Minutes</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#photo">Photos</a></li>
 +
<li><a href="https://2013.igem.org/Team:UESTC/project.html#video">Videos</a></li>
 +
</ul>
 +
</li>
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC/Medal Fufillment.html">Medal Fufillment</a>
 +
</li>
 +
 +
<li>
 +
<a href="https://2013.igem.org/Team:UESTC/human practice.html">Human Practice</a>
 +
</li>
 +
  </ul>
 +
</nav>
-
    .navbar {
+
</body>     
-
      overflow: hidden
+
-
    }
+
-
    /*
+
-
    * main info style
+
-
    */
+
-
.article{
+
-
position:relative;
+
-
padding:5px;
+
-
width: 80%;
+
-
left: 8%;
+
-
}
+
-
.article .proj_info{
+
-
font: 0.8em Arial;
+
-
}
+
-
</style>
+
-
 
+
-
</head>
+
-
<body>
+
-
<div id="main">
+
-
<div class="container">
+
-
    <div id="slides">
+
-
    <img src="https://static.igem.org/mediawiki/2013/8/89/Slide1.png" />
+
-
      <img src="https://static.igem.org/mediawiki/2013/7/73/Slide2.jpg" />                       
+
-
      <img src="https://static.igem.org/mediawiki/2013/b/b4/Slide3.jpg" />       
+
-
      <img src="https://static.igem.org/mediawiki/2013/f/fd/Slide4.jpg" />
+
-
    </div>
+
-
      </div><!--end of container-->
+
-
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
+
-
<script src="https://2013.igem.org/Team:UESTC/js/jquery.slides.min.js?action=raw&ctype=text/javascript"></script>
+
-
    <script type="text/javascript">
+
-
    $(function() {
+
-
      $('#slides').slidesjs({
+
-
        width: 600,
+
-
        height: 400,
+
-
        play: {
+
-
          active: true,
+
-
          auto: true,
+
-
          interval: 4000,
+
-
          swap: true
+
-
        }
+
-
      });
+
-
    });
+
-
    </script>
+
-
    <div id="hello">
+
-
    <p>Hi there, We are 2013 iGEM Competition  Software Team UESTC(University of Eelctronic Science and Technology of China). Our team is composed of 3 instructors, 2 advisors, 8 student members from different schools. We have accomplished several projects including...
+
-
</p>
+
-
    </div>
+
-
    <div id="project1" class="article">
+
-
    <div id="pro1_logo"></div>
+
-
    <div class="proj_info">
+
-
    <h3>Blueprinting</h3>
+
-
    <p>Bla bla bla bla blabla bla bla bla   bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla       
+
-
    </p>
+
-
    </div>
+
-
    </div>
+
-
    <div id="project2" class="article">
+
-
    <div id="pro2_logo"></div>
+
-
    <div class="proj_info">
+
-
    <h3>Transpeeder</h3>
+
-
    <p>Bla bla bla bla blabla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla     
+
-
        </p>
+
-
    </div>
+
-
    </div>
+
-
    <div id="project3" class="article">
+
-
    <div id="pro3_logo"></div>
+
-
    <div class="proj_info">
+
-
    <h3>iBiobrick</h3>
+
-
    <p>Bla bla bla bla blabla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla    bla bla bla bla     
+
-
      </p>
+
-
    </div>
+
-
    </div>
+
-
    <div id="top">
+
-
<a href="#logo"><img src="https://static.igem.org/mediawiki/2013/c/c3/UESTC_top.png" /></a>
+
-
</div>
+
-
</div>
+
-
    <!--end of #main-->
+
-
    </body>
+
</html>
</html>
-
{{Team:UESTC/footer}}
 

Revision as of 03:32, 6 August 2013

header

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