Team:NJU China

From 2013.igem.org

(Difference between revisions)
 
(151 intermediate revisions not shown)
Line 1: Line 1:
-
<!DOCTYPE html>
+
<html lang="en">
-
<html lang="en" class="no-js">
+
<head>
-
<head>
+
        <meta charset="UTF-8" />
-
<meta charset="UTF-8" />
+
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  
+
         <meta name="viewport" content="width=device-width, initial-scale=1.0">  
-
         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+
<style type="text/css">
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
+
-
<title>NJU_China</title>
+
-
<meta name="description" content="Circular Navigation Styles - Building a Circular Navigation with CSS Transforms | Codrops " />
+
-
<meta name="keywords" content="css transforms, circular navigation, round navigation, circular menu, tutorial" />
+
-
<meta name="author" content="Sara Soueidan for Codrops" />
+
-
<link rel="shortcut icon" href="../favicon.ico">
+
-
<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js?foo"></script>
+
-
<link rel="stylesheet" type="text/css" href="http://cs.wellesley.edu/~hcilab/iGEM2012/css/Team.css">
 
-
<STYLE type="text/css">
 
/* hiding the top section*/
/* hiding the top section*/
-
body{position:absolute; top:0px; width:100%; height:1480px;}
+
body{position:absolute; top:0px; width:100%; height:100%;}
#top-section{
#top-section{
   height:0px;
   height:0px;
Line 36: Line 27:
#globalWrapper{position:absolute; top:0px;left:0px; width:100%; padding:0 0 0 0;margin:0 0 0 0;height:100%;font-family: calibri, Arial, Helvetica, sans-serif;}
#globalWrapper{position:absolute; top:0px;left:0px; width:100%; padding:0 0 0 0;margin:0 0 0 0;height:100%;font-family: calibri, Arial, Helvetica, sans-serif;}
#content{
#content{
-
     background-color:transparent;
+
     background-color:white;
     border:none;
     border:none;
-
     width:1200px;
+
     width:1340px;
-
    height:700px;
+
/*    height:700px;*/
     marign:0 auto;
     marign:0 auto;
     padding:0 0 0 0;
     padding:0 0 0 0;
Line 73: Line 64:
     z-index: 5000;
     z-index: 5000;
     font-family: sans-serif;
     font-family: sans-serif;
-
     font-size: 95%;
+
     font-size: 55%;
     line-height: 1em;
     line-height: 1em;
     z-index:99;
     z-index:99;
Line 79: Line 70:
-
.left-menu, .left-menu a {
+
#aa{
-
    text-align: left;
+
        width:100%;
-
    color:#999999;
+
        height:100%;
-
    text-transform: lowercase;
+
        margin:0 0 0 0;
-
}
+
        padding:0 0 0 0;
 +
float:left;
 +
position:absolute;
-
.left-menu:hover {
+
       
-
    color: #D00000;
+
-
    background-color: transparent;
+
}
}
-
.right-menu{width:400px; float:right}
+
#b{
-
.right-menu, .right-menu a {
+
        width:100%;
-
    right: 0px;
+
        height:100%;
-
    text-align: right;
+
        margin:0 0 0 0;
-
    color: #999999;
+
        padding:0 0 0 0;
-
}
+
float:left;
-
#menubar ul {
+
display:none;
-
    color: #999999;
+
-
    list-style: none;
+
-
}
+
-
#menubar li {
+
-
    display: inline;
+
-
    position: relative;
+
-
    cursor: pointer;
+
-
    padding-left: 0px;
+
-
    padding-right: 0px;
+
-
}
+
-
.left-menu li a {
+
-
    padding: 0px 10px 0px 0px;
+
-
}
+
-
.left-menu .selected {
+
-
#    color: #999999;
+
-
}
+
-
#.left-menu .selected:hover {
+
-
#    color: #999999;
+
-
#}
+
-
 
+
-
.left-menu:hover a {
+
-
    color: #999999;;
+
-
}
+
-
 
+
-
.left-menu li a:hover {
+
-
    color: #D00000;
+
-
    text-decoration: underline;
+
-
}
+
-
 
+
-
 
+
-
.right-menu li {
+
-
#    background-color: transparent;
+
-
}
+
-
.right-menu li a {
+
-
    padding: 0px 15px 0px 0px;
+
-
    color: #999999;;
+
-
    background-color: transparent;
+
-
}
+
-
.right-menu li a:hover {
+
-
    color: #D00000;
+
-
    text-decoration: underline;
+
-
}
+
-
/* end menu (edit, page ...) */
+
-
 
+
-
 
+
-
/* HEADER STYLES: banner, navbar, etc. */
+
-
 
+
-
ul#nav {
+
-
width:1200px;
+
-
margin:0 0 0 30px;
+
-
position:relative;
+
-
}
+
-
 
+
-
#nav li {
+
-
 
+
-
color: #FFFFFF;
+
-
background-color:none;
+
-
margin: 0 50px 0 30px;
+
-
float: left;
+
-
position: relative;
+
-
list-style: none;
+
-
text-transform:uppercase;
+
-
}
+
-
#nav li:last-child { margin:0; }
+
-
 
+
-
 
+
-
/* dropdown */
+
-
#nav li:hover > ul {
+
-
/*display: block;*/
+
-
opacity:1;
+
-
margin:0;
+
-
background-color: none;
+
-
z-index:0;
+
-
}
+
-
 
+
-
/* level 2 list */
+
-
#nav ul {
+
-
/*display: none;*/
+
-
opacity:0;
+
-
margin: 200px 0 0 0;
+
-
padding: 70px 0 0 0;
+
-
width: 205px;
+
-
position: absolute;
+
-
left: 0;
+
-
z-index:-1;
+
-
-webkit-transition-duration:0.5s;
+
-
-moz-transition-duration:0.5s;
+
-
-o-transition-duration:0.5s;
+
-
}
+
-
#nav ul li {
+
-
float: none;
+
-
margin: 0;
+
-
padding: 0;
+
-
}
+
-
 
+
-
#nav ul a {
+
-
font-weight: normal;
+
-
/*text-shadow: 0 1px 0 #fff;*/
+
-
}
+
-
 
+
-
 
+
-
</STYLE>
+
-
 
+
-
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css'>
+
-
 
+
-
 
+
-
<style type="text/css">
+
-
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
+
-
@font-face {
+
-
font-family: 'codropsicons';
+
-
src:url('../fonts/codropsicons/codropsicons.eot');
+
-
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
+
-
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
+
-
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
+
-
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
+
-
font-weight: normal;
+
-
font-style: normal;
+
-
}
+
-
 
+
-
.container > header,
+
-
.codrops-top,
+
-
.container > section {
+
-
font-family: 'Lato', Arial, sans-serif;
+
-
}
+
-
 
+
-
.container > header {
+
-
margin: 0 auto;
+
-
padding: 2em;
+
-
text-align: center;
+
-
background: rgba(0,0,0,0.01);
+
-
}
+
-
 
+
-
.container > header h1 {
+
-
font-size: 2.625em;
+
-
line-height: 1.3;
+
-
margin: 0;
+
-
font-weight: 300;
+
-
}
+
-
 
+
-
.container > header span {
+
-
display: block;
+
-
font-size: 60%;
+
-
opacity: 0.7;
+
-
padding: 0 0 0.6em 0.1em;
+
-
}
+
-
 
+
-
/* To Navigation Style */
+
-
.codrops-top {
+
-
background: #f06060;
+
-
background: rgba(255, 255, 255, 0.1);
+
-
text-transform: uppercase;
+
-
width: 100%;
+
-
font-size: 0.69em;
+
-
line-height: 2.2;
+
-
}
+
-
 
+
-
.codrops-top a {
+
-
text-decoration: none;
+
-
padding: 0 1em;
+
-
letter-spacing: 0.1em;
+
-
color: #fff;
+
-
display: inline-block;
+
-
}
+
-
 
+
-
.codrops-top a:hover {
+
-
background: rgba(255,255,255,0.95);
+
-
color: #777;
+
-
}
+
-
 
+
-
.codrops-top span.right {
+
-
float: right;
+
-
}
+
-
 
+
-
.codrops-top span.right a {
+
-
float: left;
+
-
display: block;
+
-
}
+
-
 
+
-
.codrops-icon:before {
+
-
font-family: 'codropsicons';
+
-
margin: 0 4px;
+
-
speak: none;
+
-
font-style: normal;
+
-
font-weight: normal;
+
-
font-variant: normal;
+
-
text-transform: none;
+
-
line-height: 1;
+
-
-webkit-font-smoothing: antialiased;
+
-
}
+
-
 
+
-
.codrops-icon-drop:before {
+
-
content: "\e001";
+
-
}
+
-
 
+
-
.codrops-icon-prev:before {
+
-
content: "\e004";
+
-
}
+
-
 
+
-
/* Demo Buttons Style */
+
-
.codrops-demos {
+
-
padding-top: 1em;
+
-
font-size: 0.9em;
+
-
}
+
-
 
+
-
.codrops-demos a {
+
-
text-decoration: none;
+
-
outline: none;
+
-
display: inline-block;
+
-
margin: 0.5em;
+
-
padding: 0.7em 1.1em;
+
-
border: 3px solid #fff;
+
-
color: #fff;
+
-
font-weight: 700;
+
-
}
+
-
 
+
-
.codrops-demos a:hover,
+
-
.codrops-demos a.current-demo,
+
-
.codrops-demos a.current-demo:hover {
+
-
opacity: 0.6;
+
-
}
+
-
 
+
-
.container > section {
+
-
padding: 2em;
+
-
font-size: 1.4em;
+
-
max-width: 50em;
+
-
margin: 0 auto;
+
-
}
+
-
 
+
-
.container > section p {
+
-
padding: 0.8em 0;
+
-
text-align: justify;
+
-
opacity: 0.5;
+
-
font-weight: 300;
+
-
line-height: 1.4;
+
-
}
+
-
 
+
-
@media screen and (max-width: 25em) {
+
-
 
+
-
.codrops-icon span {
+
-
display: none;
+
-
}
+
-
 
+
}
}
</style>
</style>
-
<style type="text/css">
+
<script language="javascript">
-
* {
+
function changemodel()
-
position: relative;
+
{
-
-moz-box-sizing: border-box;
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/2/27/Nju-home-Model.png";
-
box-sizing: border-box;
+
document.getElementById("b").style.display="block";
-
margin: 0;
+
-
padding: 0;
+
-
list-style: none;
+
}
}
-
 
+
function changeproject()
-
html,
+
{
-
body {
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/c/c6/Nju-home-Project.png";
-
height: 100%;
+
document.getElementById("b").style.display="block";
}
}
-
 
+
function changehuman()
-
body {
+
{
-
background: #52be7f;
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/9/94/Human1111.png";
-
color: #fff;
+
document.getElementById("b").style.display="block";
}
}
-
 
+
function changesafety()
-
.component {
+
{
-
position: relative;
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/f/f0/Nju-home-Safety.png";
-
margin-bottom: 3em;
+
document.getElementById("b").style.display="block";
-
height: 15em;
+
-
background: rgba(0,0,0,0.05);
+
-
font-family: 'Lato', Arial, sans-serif;
+
}
}
-
 
+
function changewetlab()
-
@media only screen and (max-width: 620px) {
+
{
-
.no-csstransforms li {
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/e/ed/Nju-logo-Wet_lab.png";
-
width: 4em;
+
document.getElementById("b").style.display="block";
-
height: 4em;
+
-
line-height: 4em;
+
-
}
+
}
}
-
 
+
function changeteam()
-
@media only screen and (max-width: 500px) {
+
{
-
.no-ccstransforms .cn-wrapper {
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/5/55/Nju-home-Team.png";
-
padding: .5em;
+
document.getElementById("b").style.display="block";
-
}
+
-
 
+
-
.no-csstransforms .cn-wrapper li {
+
-
width: 4em;
+
-
height: 4em;
+
-
font-size: .9em;
+
-
line-height: 4em;
+
-
}
+
}
}
-
 
+
function changeextras()
-
@media only screen and (max-width: 480px) {
+
{
-
.csstransforms .cn-wrapper {
+
document.getElementById("image").src = "https://static.igem.org/mediawiki/2013/6/68/Nju-home-Extras.png";
-
font-size: .68em;
+
document.getElementById("b").style.display="block";
-
}
+
-
 
+
-
.cn-button {
+
-
font-size: 1em;
+
-
}
+
}
}
-
 
+
function home()
-
@media only screen and (max-width:420px) {
+
{
-
.no-csstransforms .cn-wrapper li {
+
document.getElementById("b").style.display="none";
-
width: 100%;
+
-
height: 3em;
+
-
line-height: 3em;
+
-
}
+
}
}
 +
</script>
-
</style>
+
</head>
-
</head>
+
-
<body>
+
-
<div class="container">
+
-
<header>
+
-
<h1>Biomissile <span>School of Life Science , Nanjing University .</span></h1>
+
-
<a href="https://igem.org/Team_Wikis?year=2013"><img id="Logo" width=400 height=300 src="https://static.igem.org/mediawiki/2013/3/3a/Final_Logo_of_NJU.png" style="position:absolute; left:700px; top:10px; " /></a>
+
-
</header>
+
-
            <!--Start NavBar-->
+
<body style="margin:0px;padding:0px; ">
-
<ul id="nav">
+
<div style="float:left; position:absolute; z-index:1; display:block; ">
-
    <li><a href="https://2013.igem.org/Team:NJU_China">Home</a></li>
+
</br></br>
-
+
<a href="https://2013.igem.org"><img src="https://static.igem.org/mediawiki/2013/2/26/NJU-Miniminilogo.png" ></a>
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Team">Team</a></li>  
+
</div>
-
 
+
<div id="aa">
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Project">Project</a>
+
-
        <ul>
+
-
  <li><a href="http://https://2013.igem.org/Team:NJU_China/Project#Overall_project">Project Overview</a></li>
+
-
          <li><a https://2013.igem.org/Team:NJU_China/Project#Project_Details">Project Details</a></li>
+
-
          <li><a https://2013.igem.org/Team:NJU_China/Project#Part_2">Part2</a></li>  
+
-
          <li><a https://2013.igem.org/Team:NJU_China/Project#The_Experiments">The_Experiments</a></li>  
+
-
          <li><a https://2013.igem.org/Team:NJU_China/Project#Part_3">Part3</a></li>
+
-
          <li><a https://2013.igem.org/Team:NJU_China/Project#Results">Results</a></li>
+
-
        </ul>
+
-
    </li>
+
-
+
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Parts">Parts</a></li>
+
-
 
+
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Modeling">Modeling</a></li>
+
-
   
+
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Notebook">Notebook</a></li>  
+
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Safety">Safety</a></li>
+
<img src="https://static.igem.org/mediawiki/2013/0/0b/NJU_home_Index.png" usemap="#Map"/>
 +
<map name="Map" id="Map">
 +
<area shape="rect" coords="400,590,970,679" onmouseover="home();" href="#"onfocus="blur(this);">
 +
<area shape="circle" coords="400,122,82" onmouseover="changemodel();" href="https://2013.igem.org/Team:NJU_China/Modeling" onfocus="blur(this);"/>
 +
<area shape="circle" coords="236,432,116" onmouseover="changeproject();" href="https://2013.igem.org/Team:NJU_China/Project" onfocus="blur(this);"/>
 +
<area shape="circle" coords="530,315,110" onmouseover="changehuman();" href="https://2013.igem.org/Team:NJU_China/Human Practice" onfocus="blur(this);"/>
 +
<area shape="circle" coords="875,173,105" onmouseover="changesafety();" href="https://2013.igem.org/Team:NJU_China/Safety" onfocus="blur(this);"/>
 +
<area shape="circle" coords="762,388,105" onmouseover="changewetlab();" href="https://2013.igem.org/Team:NJU_China/Wet lab" onfocus="blur(this);"/>
 +
<area shape="circle" coords="995,362,78" onmouseover="changeteam();" href="https://2013.igem.org/Team:NJU_China/Team" onfocus="blur(this);"/>
 +
<area shape="circle" coords="1138,490,71" onmouseover="changeextras();" href="https://2013.igem.org/Team:NJU_China/Extras" onfocus="blur(this);"/>
 +
</map>
 +
</div>
 +
<div id ="b">
 +
<img id = "image" src="https://static.igem.org/mediawiki/2013/6/68/Nju-home-Extras.png">
 +
</div>
-
    <li><a href="https://2013.igem.org/Team:NJU_China/Attributions">Attributions</a></li>
+
</body>
-
   
+
-
</ul>
+
-
<!--End NavBar-->
+
-
<div class="component">
+
-
</div>
+
-
<section>
+
-
<p>Soko leek tomatillo quandong winter purslane caulie jícama daikon dandelion bush tomato. Daikon cress amaranth leek cabbage black-eyed pea kakadu plum scallion watercress garbanzo gram caulie welsh onion water spinach tomatillo groundnut desert raisin. Wakame salsify bunya nuts spring onion lotus root prairie turnip fennel onion dandelion black-eyed pea bok choy zucchini taro. Jícama collard greens amaranth bell pepper catsear brussels sprout sweet pepper daikon spring onion aubergine broccoli rabe quandong mustard celery corn groundnut peanut. Mung bean fennel eggplant water spinach bunya nuts sierra leone bologi epazote okra caulie groundnut black-eyed pea parsnip fava bean squash.</p>
+
-
<p>Parsnip tomatillo swiss chard garbanzo gourd potato silver beet. Celery swiss chard melon zucchini arugula pea quandong beet greens radish artichoke black-eyed pea endive winter purslane horseradish garlic amaranth collard greens chickpea. Rock melon pumpkin collard greens celery broccoli rabe endive nori brussels sprout gourd courgette sea lettuce artichoke desert raisin coriander chard.</p>
+
-
<p>Collard greens ricebean horseradish wattle seed chard epazote potato peanut gram earthnut pea spinach yarrow desert raisin salad mung bean summer purslane fennel. Water spinach celery cucumber grape cauliflower nori daikon sweet pepper endive lentil turnip greens catsear leek beet greens. Melon seakale parsnip soybean bamboo shoot fennel scallion. Coriander groundnut squash corn aubergine bitterleaf azuki bean dandelion courgette broccoli rabe. Chickweed salsify chickweed groundnut nori okra lentil water spinach rock melon broccoli. Soko leek tomatillo quandong winter purslane caulie jícama daikon dandelion bush tomato. Daikon cress amaranth leek cabbage black-eyed pea kakadu plum scallion watercress garbanzo gram caulie welsh onion water spinach tomatillo groundnut desert raisin. Wakame salsify bunya nuts spring onion lotus root prairie turnip fennel onion dandelion black-eyed pea bok choy zucchini taro. Jícama collard greens amaranth bell pepper catsear brussels sprout sweet pepper daikon spring onion aubergine broccoli rabe quandong mustard celery corn groundnut peanut. Mung bean fennel eggplant water spinach bunya nuts sierra leone bologi epazote okra caulie groundnut black-eyed pea parsnip fava bean squash.</p>
+
-
<p>Parsnip tomatillo swiss chard garbanzo gourd potato silver beet. Celery swiss chard melon zucchini arugula pea quandong beet greens radish artichoke black-eyed pea endive winter purslane horseradish garlic amaranth collard greens chickpea. Rock melon pumpkin collard greens celery broccoli rabe endive nori brussels sprout gourd courgette sea lettuce artichoke desert raisin coriander chard.</p>
+
-
<p>Collard greens ricebean horseradish wattle seed chard epazote potato peanut gram earthnut pea spinach yarrow desert raisin salad mung bean summer purslane fennel. Water spinach celery cucumber grape cauliflower nori daikon sweet pepper endive lentil turnip greens catsear leek beet greens. Melon seakale parsnip soybean bamboo shoot fennel scallion. Coriander groundnut squash corn aubergine bitterleaf azuki bean dandelion courgette broccoli rabe. Chickweed salsify chickweed groundnut nori okra lentil water spinach rock melon broccoli.</p>
+
-
</section>
+
-
</div><!-- /container -->
+
-
</body>
 
</html>
</html>

Latest revision as of 03:48, 28 September 2013