(60 intermediate revisions by 4 users not shown) | |||
Line 31: | Line 31: | ||
float: left; | float: left; | ||
top: 0px; | top: 0px; | ||
− | background-color: # | + | background-color: #592e2e; |
margin-top:0px; | margin-top:0px; | ||
width: 10%; | width: 10%; | ||
Line 46: | Line 46: | ||
width: 10%; | width: 10%; | ||
height: 100%; | height: 100%; | ||
− | |||
padding-left: 20px; | padding-left: 20px; | ||
padding-top: 25px; | padding-top: 25px; | ||
Line 71: | Line 70: | ||
} | } | ||
− | . | + | .line { |
position: fixed; | position: fixed; | ||
float: left; | float: left; | ||
Line 77: | Line 76: | ||
left:10%; | left:10%; | ||
background-color: #aadffa; | background-color: #aadffa; | ||
− | width: | + | width: 1%; |
+ | height: 100%; | ||
+ | padding-right:-20px; | ||
+ | padding-top:10px; | ||
+ | } | ||
+ | |||
+ | .left { | ||
+ | position: fixed; | ||
+ | float: left; | ||
+ | top: 0px; | ||
+ | left:12%; | ||
+ | background-color: #aadffa; | ||
+ | width:10%; | ||
height: 100%; | height: 100%; | ||
padding-right:-20px; | padding-right:-20px; | ||
Line 107: | Line 118: | ||
transition: 0.3s; | transition: 0.3s; | ||
font-weight:bold; | font-weight:bold; | ||
− | font-size: | + | font-size:18px; |
} | } | ||
Line 116: | Line 127: | ||
transition:all 0.3s; | transition:all 0.3s; | ||
transform: scale(1.15); | transform: scale(1.15); | ||
+ | } | ||
+ | .left li:before { | ||
+ | content: ''; | ||
+ | height: 100%; | ||
+ | left: 0; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | -webkit-transition: width 0.2s ease-in; | ||
+ | transition: width 0.2s ease-in; | ||
+ | width: 3px; | ||
+ | z-index: -1; | ||
+ | } | ||
+ | |||
+ | |||
+ | .left li:hover:before { | ||
+ | -webkit-transition: width 0.2s ease-in; | ||
+ | transition: width 0.2s ease-in; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .left li.open:hover before { | ||
+ | -webkit-transition: width 0.2s ease-in; | ||
+ | transition: width 0.2s ease-in; | ||
+ | width: 100%; | ||
} | } | ||
Line 130: | Line 165: | ||
top:0px; | top:0px; | ||
z-index: -1; | z-index: -1; | ||
− | + | ||
} | } | ||
Line 137: | Line 172: | ||
position:absolute; | position:absolute; | ||
float: left; | float: left; | ||
− | top: | + | top:20%; |
left:28%; | left:28%; | ||
font-size: 48px; | font-size: 48px; | ||
Line 149: | Line 184: | ||
float: left; | float: left; | ||
top:110%; | top:110%; | ||
− | left: | + | left:20%; |
width:71%; | width:71%; | ||
font-size: 18px; | font-size: 18px; | ||
z-index: 2; | z-index: 2; | ||
− | |||
margin-left:50px; | margin-left:50px; | ||
line-height: 35px; | line-height: 35px; | ||
Line 161: | Line 195: | ||
.content .h1{ | .content .h1{ | ||
margin-top: 20px; | margin-top: 20px; | ||
− | font-size: | + | font-size: 33px; |
font-weight: bold; | font-weight: bold; | ||
color: #aadffa; | color: #aadffa; | ||
Line 171: | Line 205: | ||
text-align:center; | text-align:center; | ||
font-size: 8x; | font-size: 8x; | ||
− | + | ||
} | } | ||
Line 177: | Line 211: | ||
display: inline-block; | display: inline-block; | ||
text-indent:2em; | text-indent:2em; | ||
− | font-size: | + | font-size: 16px; |
padding-top: 20px; | padding-top: 20px; | ||
padding-bottom: 20px; | padding-bottom: 20px; | ||
− | |||
} | } | ||
Line 212: | Line 245: | ||
height:100%; | height:100%; | ||
top:0; | top:0; | ||
+ | padding-top:15px; | ||
transform:rotateY(.5turn) | transform:rotateY(.5turn) | ||
translateZ(1px); | translateZ(1px); | ||
Line 217: | Line 251: | ||
text-align:center; | text-align:center; | ||
opacity:0.6; | opacity:0.6; | ||
− | font-size: | + | font-size:15px; |
color:#202020; | color:#202020; | ||
transition:1s .5s opacity; | transition:1s .5s opacity; | ||
+ | line-height:24px; | ||
} | } | ||
Line 239: | Line 274: | ||
+ | #contact{ | ||
+ | border-radius: 15px; | ||
+ | width: 90%; | ||
+ | height:auto; | ||
+ | background:rgba(255,255,255,0.4); | ||
+ | /* border: 2.5px solid rgba(0,0,0,0.7);*/ | ||
+ | z-index: 5; | ||
+ | text-align: center; | ||
+ | display: block; | ||
+ | margin-bottom: 100px; | ||
+ | } | ||
+ | |||
+ | #contact h3{ | ||
+ | font-size: 22px; | ||
+ | margin-top:35px; | ||
+ | margin-bottom:10px; | ||
+ | color : #5b3d3d; | ||
+ | } | ||
+ | |||
+ | #contact span{ | ||
+ | margin-top: 15px; | ||
+ | font-size: 19px; | ||
+ | color : #826767; | ||
+ | } | ||
+ | |||
+ | #contact img{ | ||
+ | margin-top: 10px; | ||
+ | transition: all 0.4s; | ||
+ | margin-bottom: 30px; | ||
+ | } | ||
+ | |||
+ | #contact img:hover{ | ||
+ | transform: scale(1.15); | ||
+ | transition: all 0.4s; | ||
+ | } | ||
+ | |||
+ | #btn{ | ||
+ | display: none; | ||
+ | position: fixed; | ||
+ | left: 90%; | ||
+ | bottom: 40px; | ||
+ | height:80px; | ||
+ | width: 80px; | ||
+ | background: url(https://static.igem.org/mediawiki/2018/d/d1/T--Tongji-Software--top.png) no-repeat left top; | ||
+ | background-size:100% auto; | ||
+ | } | ||
</style> | </style> | ||
+ | <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:Tongji-Software/test/css/style.css&action=raw&ctype=text/css"> | ||
<body> | <body> | ||
Line 253: | Line 335: | ||
<a href="https://2018.igem.org/Team:Tongji-Software/Attributions" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/8/86/T--Tongji-Software--Att.svg" width="35%" ></li></a> | <a href="https://2018.igem.org/Team:Tongji-Software/Attributions" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/8/86/T--Tongji-Software--Att.svg" width="35%" ></li></a> | ||
− | <a href="https://2018.igem.org/Team:Tongji-Software/ | + | <a href="https://2018.igem.org/Team:Tongji-Software/Model" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/7/77/T--Tongji-Software--Mod.svg" width="35%" ></li></a> |
<a href="https://2018.igem.org/Team:Tongji-Software/Collaborations" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/d/d3/T--Tongji-Software--Col.svg" width="35%" ></li></a> | <a href="https://2018.igem.org/Team:Tongji-Software/Collaborations" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/d/d3/T--Tongji-Software--Col.svg" width="35%" ></li></a> | ||
Line 259: | Line 341: | ||
<a href="https://2018.igem.org/Team:Tongji-Software/Requirements" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/5/5f/T--Tongji-Software--Req.svg" width="35%" ></li></a> | <a href="https://2018.igem.org/Team:Tongji-Software/Requirements" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/5/5f/T--Tongji-Software--Req.svg" width="35%" ></li></a> | ||
− | <a href="https://2018.igem.org/Team:Tongji-Software/ | + | <a href="https://2018.igem.org/Team:Tongji-Software/Human_Practices" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/c/cc/T--Tongji-Software--Hum.svg" width="35%" ></li></a> |
− | <a href="https://2018.igem.org/Team:Tongji-Software/ | + | <a href="https://2018.igem.org/Team:Tongji-Software/Medal" original-title="Project"><li><img src="https://static.igem.org/mediawiki/2018/8/8b/T--Tongji-Software--Med.svg" width="35%" ></li></a> |
</ul> | </ul> | ||
</div> | </div> | ||
− | + | <div class="line"></div> | |
− | <div class="left"> | + | <div><a href="javascript:;" id="btn" title="Return to Top"></a></div> |
+ | <div id = "wrapper"> | ||
+ | <div class="left" id = "sidebar-wrapper"> | ||
<ul> | <ul> | ||
<li><a href="#Overview">Overview</a></li> | <li><a href="#Overview">Overview</a></li> | ||
Line 288: | Line 372: | ||
− | <div class="content"> | + | <div class="content" id="con"> |
Line 299: | Line 383: | ||
<span class="detail"><b>Our team is consisted of different people with same passion for inter-discipline. Differences make the team integrated. Some of us were best friends before iGEM 2018. Some of us didn’t even meet. We are from various majors, biology, biotechnology, bioinformatics, computer engineering & design.</b></span> | <span class="detail"><b>Our team is consisted of different people with same passion for inter-discipline. Differences make the team integrated. Some of us were best friends before iGEM 2018. Some of us didn’t even meet. We are from various majors, biology, biotechnology, bioinformatics, computer engineering & design.</b></span> | ||
<span class="detail"><b>Since we only have seven team members, each of us has made great difference in our project.</b></span> | <span class="detail"><b>Since we only have seven team members, each of us has made great difference in our project.</b></span> | ||
− | + | </br> | |
− | <span class="h1" id=" | + | <span class="h1" id="member"> |
Team members</br> | Team members</br> | ||
</span> | </span> | ||
Line 317: | Line 401: | ||
<b>Xiaotian Yu</b></br> | <b>Xiaotian Yu</b></br> | ||
<span class="top">Bioinformatics</span> | <span class="top">Bioinformatics</span> | ||
− | <figcaption> In this project, I’m in charge of modeling, data analyzing | + | <figcaption> In this project, I’m in charge of modeling, data analyzing. Thanks to iGEM for this opportunity to cooperate with my creative and reliable teammates. I hope that our software will play a significant role in metabolic pathway design in the future!</figcaption> |
</figure> | </figure> | ||
</div> | </div> | ||
Line 327: | Line 411: | ||
</figure> | </figure> | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
Line 349: | Line 428: | ||
</div> | </div> | ||
<div class="flip-3d"> | <div class="flip-3d"> | ||
− | <figure> <img src="https://static.igem.org/mediawiki/2018/b/bc/ | + | <figure> <img src="https://static.igem.org/mediawiki/2018/archive/b/bc/20181012123042%21T--Tongji-Software--Team-Yuejia.jpeg" width="100%"> |
<b>Yuejia Li</b></br> | <b>Yuejia Li</b></br> | ||
<span class="top">Industrial Design</span> | <span class="top">Industrial Design</span> | ||
− | <figcaption>This is a | + | <figcaption>This is a challenge for me to help raise up a team’s image through the visual identity and interface design. I am always fond of exploring the possibilities in the inter-discipline. I believe that iGEM has offered me the chance to make it more realistic this time!</figcaption> |
</figure> | </figure> | ||
</div> | </div> | ||
Line 360: | Line 439: | ||
xdbwiehocurnviomtoinb</br> | xdbwiehocurnviomtoinb</br> | ||
</span> | </span> | ||
− | |||
Line 367: | Line 445: | ||
<b>Xiangzhen Li</b></br> | <b>Xiangzhen Li</b></br> | ||
<span class="top">Computer Engineering</span> | <span class="top">Computer Engineering</span> | ||
− | <figcaption>I have rich experience in Web front-end programming, modeling and data analysis &processing. More importantly, I have a strong interest in using computer science tools to solve various interdisciplinary problems. | + | <figcaption>I have rich experience in Web front-end programming, modeling and data analysis &processing. More importantly, I have a strong interest in using computer science tools to solve various interdisciplinary problems.I like Beijing Opera and literature. </figcaption> |
</figure> | </figure> | ||
</div> | </div> | ||
Line 374: | Line 452: | ||
</div> | </div> | ||
− | < | + | </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> </br> |
− | + | ||
− | + | ||
− | </br> </br></br></br></br> </br></br></br></br> </br></br></br></br> </br></br></br> | + | |
<span class="h1" id="Instructors"> | <span class="h1" id="Instructors"> | ||
Line 383: | Line 459: | ||
</span> | </span> | ||
+ | <div class="jq22-container"> | ||
+ | <div class="jq22-content"> | ||
+ | <div class="flip-3d"> | ||
+ | <figure> <img src="https://static.igem.org/mediawiki/2018/a/a0/T--Tongji-Software--Team-liuqi.jpeg" width="100%"> | ||
+ | <b>Qi Liu</b></br> | ||
+ | <span class="top">Bioinformatics</span> | ||
+ | <figcaption> We are Tongji-software Team! We are Super Geekers for Bioinformatics! Fighting!</figcaption> | ||
+ | </figure> | ||
+ | </div> | ||
+ | <div class="flip-3d"> | ||
+ | <figure> <img src="https://static.igem.org/mediawiki/2018/a/a8/T--Tongji-Software--Team-liping.jpeg" width="100%"> | ||
+ | <b>Ping Li</b></br> | ||
+ | <span class="top"> Synthetic Biology</span> | ||
+ | <figcaption> IGEM aims to help construct a society that can productively and safely apply biological technology. Our lab focused on synthetic biology of active natural products and the engineering of microbes. Hope the jamboree can bring the team excitement and inspiration.</figcaption> | ||
+ | </figure> | ||
+ | </div> | ||
+ | <div class="flip-3d"> | ||
+ | <figure> <img src="https://static.igem.org/mediawiki/2018/6/68/T--Tongji-Software--Team-cherry.jpeg" width="100%"> | ||
+ | <b>Mengjie Zhang</b></br> | ||
+ | <span class="top">Molecular Biology</span> | ||
+ | <figcaption>I am so glad to see Tongji-Software team has made brilliant progress in the computational tool for design metabolic pathway. Look forward to your excellent presentation in Boston.</figcaption> | ||
+ | </figure> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
</div> | </div> | ||
+ | </div> | ||
+ | <script src="https://2018.igem.org/wiki/index.php?title=Template:Tongji-Software/test/js/jquery-1.8.3.min.js&action=raw&ctype=text/javascript"></script> | ||
+ | <script src="https://2018.igem.org/wiki/index.php?title=Template:Tongji-Software/test/js/bootstrap.min.js&action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function () { | ||
+ | var trigger = $('.icon'), | ||
+ | slide = $('.left'), | ||
+ | isClosed = true; | ||
+ | |||
+ | trigger.mouseover(function () { | ||
+ | cross_out(); | ||
+ | }); | ||
+ | slide.mouseleave(function () { | ||
+ | cross_in(); | ||
+ | }); | ||
+ | |||
+ | function cross_out() { | ||
+ | if (isClosed == true) { | ||
+ | trigger.removeClass('is-open'); | ||
+ | trigger.addClass('is-closed'); | ||
+ | |||
+ | $('#wrapper').toggleClass('toggled'); | ||
+ | isClosed = false; | ||
+ | } | ||
+ | } | ||
+ | function cross_in() { | ||
+ | if (isClosed == false) { | ||
+ | trigger.removeClass('is-closed'); | ||
+ | trigger.addClass('is-open'); | ||
+ | |||
+ | $('#wrapper').toggleClass('toggled'); | ||
+ | isClosed = true; | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | <script> | ||
+ | window.onload = function(){ | ||
+ | |||
+ | var mybtn = document.getElementById("btn"); | ||
+ | var Time1 = null; | ||
+ | var isTop = true; | ||
+ | mybtn.onclick = function(){ | ||
+ | |||
+ | Time1 = setInterval(function(){ | ||
+ | var osTop = document.body.scrollTop||document.documentElement.scrollTop; | ||
+ | |||
+ | var speed = Math.ceil(osTop/2); | ||
+ | |||
+ | document.body.scrollTop = document.documentElement.scrollTop = osTop - speed; | ||
+ | if(osTop <= 0){ | ||
+ | |||
+ | clearInterval(Time1); | ||
+ | } | ||
+ | isTop = true ; | ||
+ | },100) | ||
+ | } | ||
+ | |||
+ | |||
+ | window.onscroll = function(){ | ||
+ | |||
+ | var osTop = document.body.scrollTop||document.documentElement.scrollTop; | ||
+ | |||
+ | var clientHeight = document.documentElement.clientHeight; | ||
+ | |||
+ | if (osTop>clientHeight) { | ||
+ | mybtn.style.display = "block" | ||
+ | } | ||
+ | else{ | ||
+ | mybtn.style.display = "none" | ||
+ | } | ||
+ | if (!isTop) { | ||
+ | clearInterval(Time1); | ||
+ | } | ||
+ | isTop = false; | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
</body> | </body> | ||
</html> | </html> |
Latest revision as of 16:25, 17 October 2018
Team
Overview
The collective is the source of power and the cradle of wisdom.
Our team is consisted of different people with same passion for inter-discipline. Differences make the team integrated. Some of us were best friends before iGEM 2018. Some of us didn’t even meet. We are from various majors, biology, biotechnology, bioinformatics, computer engineering & design.
Since we only have seven team members, each of us has made great difference in our project.
Team members
xdbwiehocurnviomtoinb
Instructors