(Prototype team page) |
|||
Line 1: | Line 1: | ||
− | |||
<html> | <html> | ||
+ | <style type="text/css"> | ||
+ | #top_title{ | ||
+ | display:none; | ||
+ | } | ||
+ | * { | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | a { | ||
+ | text-decoration: none; | ||
+ | } | ||
− | + | ul, | |
− | + | ol { | |
− | + | list-style: none; | |
− | + | } | |
− | + | ||
+ | body { | ||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | font-size: 14px; | ||
+ | line-height: 1.42857143; | ||
+ | color: #333; | ||
+ | min-width: 768px; | ||
+ | } | ||
− | + | .navbar-default { | |
+ | background-color: #EEE; | ||
+ | border-color: #e7e7e7; | ||
+ | top: 16px; | ||
+ | border-width: 0 0 1px; | ||
+ | position: fixed; | ||
+ | right: 0; | ||
+ | left: 0; | ||
+ | z-index: 1030; | ||
+ | min-height: 50px; | ||
+ | margin-bottom: 20px; | ||
+ | border: 1px solid transparent; | ||
+ | min-width: 768px; | ||
+ | } | ||
+ | .container { | ||
+ | padding-right: 15px; | ||
+ | padding-left: 15px; | ||
+ | margin-right: auto; | ||
+ | margin-left: auto; | ||
+ | } | ||
+ | @media screen and (min-width: 768px) { | ||
+ | .container { | ||
+ | width: 750px; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (min-width: 992px) { | ||
+ | .container { | ||
+ | width: 970px; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (min-width: 1200px) { | ||
+ | .container { | ||
+ | width: 1170px; | ||
+ | } | ||
+ | } | ||
+ | .navbar-header { | ||
+ | float: left; | ||
+ | } | ||
− | + | .navbar-brand { | |
− | + | color: #777; | |
− | + | float: left; | |
− | + | height: 50px; | |
+ | padding: 15px 15px; | ||
+ | font-size: 18px; | ||
+ | line-height: 20px; | ||
+ | } | ||
− | + | .navbar>ul>li { | |
− | + | float: left; | |
− | + | } | |
− | + | ||
− | + | ||
+ | .nav>li { | ||
+ | position: relative; | ||
+ | display: block; | ||
+ | margin-right: 10px; | ||
+ | } | ||
− | + | .nav>li>a { | |
+ | color: #777; | ||
+ | position: relative; | ||
+ | display: block; | ||
+ | padding: 8px 15px; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .nav>li>a:hover { | ||
+ | color: #333; | ||
+ | } | ||
+ | .caret { | ||
+ | display: inline-block; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | margin-left: 2px; | ||
+ | vertical-align: middle; | ||
+ | border-top: 4px solid #777; | ||
+ | border-right: 4px solid transparent; | ||
+ | border-left: 4px solid transparent; | ||
+ | position: absolute; | ||
+ | top: 18px; | ||
+ | right: 1px; | ||
+ | } | ||
− | + | .nav>li>a:hover+span { | |
− | + | border-top: 4px solid #333; | |
+ | } | ||
− | + | .nav>li .dropdown-menu { | |
− | + | margin-top: 0; | |
− | + | border-top-left-radius: 0; | |
− | + | border-top-right-radius: 0; | |
− | + | position: absolute; | |
− | + | top: 35px; | |
− | + | left: 0; | |
− | + | z-index: 1000; | |
− | + | float: left; | |
− | + | min-width: 160px; | |
− | + | padding: 5px 0; | |
− | + | margin: 2px 0 0; | |
− | + | font-size: 14px; | |
− | + | text-align: left; | |
+ | list-style: none; | ||
+ | background-color: #fff; | ||
+ | -webkit-background-clip: padding-box; | ||
+ | background-clip: padding-box; | ||
+ | border: 1px solid #ccc; | ||
+ | border: 1px solid rgba(0, 0, 0, .15); | ||
+ | border-radius: 4px; | ||
+ | -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); | ||
+ | box-shadow: 0 6px 12px rgba(0, 0, 0, .175); | ||
+ | display: none; | ||
+ | } | ||
− | + | .dropdown-menu>li { | |
− | + | display: list-item; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | .dropdown-menu>li>a { | ||
+ | display: block; | ||
+ | padding: 3px 20px; | ||
+ | clear: both; | ||
+ | font-weight: normal; | ||
+ | line-height: 1.42857143; | ||
+ | color: #333; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | .dropdown-menu>li>a:hover { | ||
+ | background-color: #eee; | ||
+ | } | ||
+ | html { | ||
+ | font-family: sans-serif; | ||
+ | -webkit-text-size-adjust: 100%; | ||
+ | -ms-text-size-adjust: 100%; | ||
+ | } | ||
+ | #mainDiv{ | ||
+ | height:3500px; | ||
+ | margin: 0; | ||
+ | min-height: 1400px; | ||
+ | padding-top: 70px; | ||
+ | min-width: 1140px; | ||
+ | background-image: url('https://static.igem.org/mediawiki/2018/4/4b/T--SCAU-China--ziyeMain.jpg') ; | ||
+ | background-attachment: fixed; | ||
− | + | background-size: cover; | |
− | + | } | |
+ | .heart { | ||
+ | width: 1140px; | ||
+ | margin: 0 auto;/* 通用的版心 */ | ||
+ | } | ||
+ | #mask { | ||
+ | width: 100%; | ||
+ | height: 4100; | ||
+ | background: rgba(0, 0, 0, 0.3); | ||
+ | margin-top: -15px; | ||
+ | padding-top: 15px; | ||
+ | } | ||
+ | .DBoard {/* 展板样式 */ | ||
+ | margin: 0px auto 40px auto; | ||
+ | width: 1000px; | ||
+ | height: 100%px; | ||
+ | border-radius: 3px; | ||
+ | background-color: #fff; | ||
+ | overflow: hidden; | ||
+ | position: relative; | ||
+ | } | ||
+ | .DBoard0 {/*文字样式*/ | ||
+ | margin: 0px auto 40px auto; | ||
+ | width: 1000px; | ||
+ | height: 500px; | ||
+ | border-radius: 3px; | ||
+ | color: white; | ||
+ | overflow: hidden; | ||
+ | position: relative; | ||
+ | } | ||
+ | #mask p { | ||
+ | color: #fff; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #lists-DB { | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | #lists-DB:hover #arr-l,#lists-DB:hover #arr-r{ | ||
+ | display: block; | ||
+ | } | ||
+ | #lists { | ||
+ | position: relative; | ||
+ | width: 4000px; | ||
+ | } | ||
+ | #lists img { | ||
+ | float: left; | ||
+ | } | ||
+ | #arr-l,#arr-r { | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | width: 40px; | ||
+ | height: 60px; | ||
+ | background: rgba(0, 0, 0, .4); | ||
+ | top: 50%; | ||
+ | margin-top: -30px; | ||
+ | color: #fff; | ||
+ | font: 600 30px/60px "宋体"; | ||
+ | line-height: 60px; | ||
+ | text-align: center; | ||
+ | display: none; | ||
+ | } | ||
+ | #arr-l:hover,#arr-r:hover { | ||
+ | background: rgba(0, 0, 0, .7); | ||
+ | } | ||
+ | #arr-l { | ||
+ | left: 0; | ||
+ | } | ||
+ | #arr-r { | ||
+ | right: 0; | ||
+ | } | ||
+ | #buttons { | ||
+ | position: absolute; | ||
+ | bottom: 15px; | ||
+ | left: 50%; | ||
+ | } | ||
+ | #buttons span { | ||
+ | width: 12px; | ||
+ | height: 12px; | ||
+ | background: #ccc; | ||
+ | float: left; | ||
+ | border-radius: 50%; | ||
+ | margin: 0 5px 0 5px; | ||
+ | } | ||
+ | .on { | ||
+ | background-color: #333 !important; | ||
+ | } | ||
+ | #toTop { | ||
+ | width: 50px; | ||
+ | height: 50px; | ||
+ | background: url("https://static.igem.org/mediawiki/2018/b/b6/T--SCAU-China--toTop.png") no-repeat center center rgba(0, 0, 0, .3); | ||
+ | position: fixed; | ||
+ | right: 50px; | ||
+ | bottom: 5px; | ||
+ | cursor: pointer; | ||
+ | display: none; | ||
+ | } | ||
− | + | ||
− | + | } | |
− | + | #img4{ | |
− | + | width: 10%; | |
− | + | } | |
− | + | #content { | |
− | + | width: 101%; | |
− | + | padding: 15px; | |
− | + | border: none; | |
− | + | color: black; | |
+ | margin-left: 20px; | ||
+ | margin-right: auto; | ||
+ | background-color: #ffffff; | ||
+ | position: relative; | ||
+ | } | ||
+ | #content { | ||
+ | position: relative; | ||
+ | width: 101%; | ||
+ | margin: 0 auto; | ||
+ | padding: 5px 5px 5px 5px; | ||
+ | background: white; | ||
+ | color: black; | ||
+ | border-left: 1px solid #444444; | ||
+ | border-right: 1px solid #444444; | ||
+ | line-height: 1.5em; | ||
+ | z-index: 2; | ||
+ | } | ||
+ | #title{ | ||
+ | height:100px; | ||
+ | background: rgba(0, 0, 0, 0.3); | ||
+ | text-align: center; | ||
+ | font-size: 60px; | ||
+ | color: white; | ||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | line-height: 100px; | ||
+ | } | ||
+ | #title2{ | ||
+ | height:70px; | ||
+ | background: rgba(0, 0, 0, 0.2); | ||
+ | text-align: left; | ||
+ | font-size: 50px; | ||
+ | color: white; | ||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | line-height: 70px; | ||
+ | } | ||
+ | #article1{ | ||
+ | background: rgba(0, 0, 0, 0); | ||
+ | height:350; | ||
+ | } | ||
+ | #article2{ | ||
+ | background: rgba(0, 0, 0, 0); | ||
+ | height:800; | ||
− | + | } | |
+ | #article3{ | ||
+ | background: rgba(0, 0, 0, 0); | ||
+ | height:150; | ||
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | <div class=" | + | #article3 p{ |
− | <div class=" | + | |
− | < | + | text-align: left; |
− | <p> | + | position: relative; |
− | </div> | + | color: white; |
+ | margin-top: 20px; | ||
+ | |||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | font-size:20px; | ||
+ | } | ||
+ | |||
+ | #article1 p{ | ||
+ | |||
+ | text-align: left; | ||
+ | position: relative; | ||
+ | color: white; | ||
+ | margin-top: 20px; | ||
+ | |||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | font-size:20px; | ||
+ | } | ||
+ | #article2 p{ | ||
+ | |||
+ | text-align: left; | ||
+ | position: relative; | ||
+ | color: white; | ||
+ | margin-top: 20px; | ||
+ | |||
+ | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; | ||
+ | font-size:20px; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | <div class="navbar-default"> | ||
+ | <div class="container"> | ||
+ | <div class="navbar-header"> | ||
+ | <a href="https://2018.igem.org/Team:SCAU-China" class="navbar-brand">SCAU-2018</a> | ||
+ | </div> | ||
+ | <div class="navbar"> | ||
+ | <ul style="float: left;" class="nav"> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">TEAM</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li> | ||
+ | <a href="#">Time shaft</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">Members</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">Advisors</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">Teachers</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">Attributions</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">Collaborations</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">PROJECT</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">Description</a></li> | ||
+ | <li><a href="#">Design</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">PART</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">Basic parts</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">RESULT</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">Experiments</a></li> | ||
+ | <li><a href="#">Proof</a></li> | ||
+ | <li><a href="#">Demonstrate</a></li> | ||
+ | <li><a href="#">Model</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">NOTE</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">NoteBook</a></li> | ||
+ | <li><a href="#">Gallery</a></li> | ||
+ | <li><a href="#">Protocol</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | <ul style="float: right;" class="nav"> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">SAFETY</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">Safety</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="javascript:void(0)">HUMAN PRACTICES</a> | ||
+ | <span class="caret"></span> | ||
+ | <ul class='dropdown-menu'> | ||
+ | <li><a href="#">Integrated</a></li> | ||
+ | <li><a href="#">Engagement</a></li> | ||
+ | <li><a href="#">Entrepreneurship</a></li> | ||
+ | <li><a href="#"></a></li> | ||
+ | <li><a href="#"></a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div id="mainDiv"> | ||
+ | <div class="heart"><!-- 版心 --> | ||
+ | <div id="mask"><!-- 半透明底板 --> | ||
+ | |||
+ | <div class="DBoard" id="title"> | ||
+ | Attributions | ||
+ | </div> | ||
+ | <div class="DBoard" id="title2"> | ||
+ | Undergraduate Students | ||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article2"><!-- 展板 --> | ||
+ | <p> | ||
+ | Those students who study science alone are all in their final semester of a four-year degree, and have taken various courses in microbiology, molecular and cell biology as well as genetics, and similar fields at the South China Agricultural University (SCAU). And they also learned a lot of special skill to make themselves a qualified iGEMers. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>WEITENG XU:</b> He set up the SCAU-iGEM 2018 team and served as the captain, not only for wet experiment, but also for our iGEM project. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>WEIXU WANG (KEN):</b> He had a self-taught bioinformatics skill and was in charge of the mathematic model part of our project. | ||
+ | |||
+ | </p> | ||
+ | |||
+ | <p> | ||
+ | <b> YINPIN HUANG:</b> She was responsible for planning and organizing the human practices works (social activities, education and entrepreneurships), and she also handled the molecular cloning experiments. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>YINGLI LI (LILY):</b> She worked mostly on the molecular cloning, and she constructed of the expression vector with Yinpin Huang. Lily also was responsible for the work about lab safety. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>WEI WANG/ YAOHUA HUANG:</b> They were charge in the cyanobacteria transformation and confirmed the modeling predicting result showed by Ken. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>XINYU ZHANG (DAISY): </b> She was participated in news reports and art design of our team, and she had donated so many beautiful ideas. | ||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>JIAHUA ZOU (KAWAH):</b> She was the designer of our team, had designed including the logo, team flag, team uniform, poster, banner and other promotional items. | ||
+ | |||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>JIADONG LI/XINLIN HUANG: </b> They worked together to accomplish the design and construction of WiKi contents. | ||
+ | |||
+ | </p> | ||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="title2"> | ||
+ | Supervisors/Advisor | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article1"><!-- 展板 --> | ||
+ | <p> | ||
+ | <b>Dr HAO WANG: </b> Our mentor, professor Hao Wang gave us advice and suggestion, and our team members can talk with him , search for his help anytime when we met difficulty to ensure that there would be consistency in our project. | ||
+ | |||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | <b>iGEM Counselor Committee of SCAU: Professors Yaoguang Liu, Yiqun Deng, Gang Hao, Haihong Wang, Jikai Wen, Guohui Zhu and Ms Dongmei He, </b> all of them were responsible and selfless to help us to make iGEM possible. | ||
+ | |||
+ | |||
+ | </p> | ||
+ | <p> | ||
+ | The training of iGEM and synthetic biology was also done on the go as the project progressed with the help of our advisors,<font color="red"> XXX and XXX. </font> | ||
+ | |||
+ | |||
+ | </p></div> | ||
+ | |||
+ | <div class="DBoard" id="title"> | ||
+ | Acknowledgements | ||
+ | </div> | ||
+ | <div class="DBoard" id="title2"> | ||
+ | Grant Support | ||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article3"> | ||
+ | |||
+ | <p> | ||
+ | Our project was supported by grants from the <b>Institute of Innovation & Entrepreneurship, the College of Life Sciences, Department of Foreign Affairs of SCAU.</b> | ||
+ | |||
+ | </p></div> | ||
+ | |||
+ | <div class="DBoard" id="title2"> | ||
+ | Lab Support | ||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article1"> | ||
+ | |||
+ | <p> | ||
+ | <b>The College of Life Sciences of SCAU: The college had provided us with an opening molecular laboratory where is our daily operation bench, a meeting room for our discussion, a plant culture room for the culture of cyanobacteria and a bacterial operation room for the bacterial safety operation. </b> | ||
+ | |||
+ | |||
+ | </p> | ||
+ | <p><b>State Key Laboratory for Conservation and Utilization of Subtropical Agro-bioresources (SKL-CUSA):</b> Thank to the advanced machines and mature methods provided by them and we can finish the experiments smoothly.</p> | ||
+ | </div><div class="DBoard" id="title2"> | ||
+ | Project support | ||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article1"> | ||
+ | |||
+ | <p> | ||
+ | <b>Institute of Hydrobiology, Chinese Academy of Sciences: | ||
+ | </b>They Sent us with the cyanobacteria :Synechocystis sp. (FACHB-898), Scytonema javanicum(FACHB-887), Microcoleus vaginatus(FACHB-253); | ||
+ | |||
+ | |||
+ | </p> | ||
+ | <p><b>Qingdao Institute of Biomass Energy and Bioprocess Technology, Chinese Academy of Sciences: | ||
+ | </b> They gifted us with the cyanobacterial expression vector pFQ20.</p> | ||
+ | <p><b>iGEM Team TUST-CHINA(2017): | ||
+ | |||
+ | </b> Thanks for the protocol of bacteria genome extraction.</p></div> | ||
+ | |||
+ | <div class="DBoard" id="title2"> | ||
+ | Human practices support | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="DBoard" id="article2"> | ||
+ | |||
+ | <p> | ||
+ | During the human practices, we received many assistances and cooperation from people and organizations. | ||
+ | |||
+ | </p> | ||
+ | <p><b>Gansu Desert control Research Institute:</b> They provided us with the valuable environmental data of desert and sand sample from Gansu province for our simulation experiment. | ||
+ | </p> | ||
+ | <p><b>The Youth League Committee of SCAU:</b> for Bauhinia Scientific & Cultural Festival, public education and popular science, the support of Graffiti Wall. | ||
+ | </p> | ||
+ | <p><b>The College of Life Sciences of SCAU:</b> for the help of Laboratory Open days. | ||
+ | </p> | ||
+ | <p><b>GZHS-united(2018)/GDSYZX(2018):</b> We help them to organize the iGEM team and we had cooperation with them in interlab experiment. | ||
+ | </p> | ||
+ | <p><b>iGEM Team: SYSU-China(2017)/ SYSU-Software (2017)/SCUT-ChinaA(2018)/NEU-ChinaB(2018)/ SUSTech_Shenzhen(2018)/FAFU-CHINA(2017)</b> for the collaboration, communications, cooperation and iGEM gathering. | ||
+ | </p> | ||
+ | <p><b>SCAU Affiliated Primary school:</b> for education courses of Biology. | ||
+ | </p> | ||
+ | </div> | ||
+ | |||
+ | <p>School's name:SCAU</p> | ||
+ | <p>Member's name:SCAU</p> | ||
+ | <p>Designed by:SCAU</p> | ||
+ | </div> | ||
+ | </div> | ||
</div> | </div> | ||
+ | <!-- 回到顶部按钮 --> | ||
+ | <em id="toTop"></em> | ||
+ | |||
+ | <script> | ||
+ | var dropdownBoxs = document.getElementsByClassName('dropdown'); | ||
+ | var dropdownMenus = document.getElementsByClassName('dropdown-menu'); | ||
+ | for (let i = 0 ; i < dropdownBoxs.length ; i ++) { | ||
+ | // console.log(dropdownBoxs[i]); | ||
+ | // console.log(dropdownMenus[i]); | ||
+ | dropdownBoxs[i].index = i; | ||
+ | dropdownBoxs[i].onclick = function () { | ||
+ | var styles = document.defaultView.getComputedStyle(dropdownMenus[i]) || dropdownMenus[i].currentStyle; | ||
+ | // console.log(styles.display); | ||
+ | if (styles.display == 'none') { | ||
+ | for (let j = 0 ; j < dropdownBoxs.length ; j ++) { | ||
+ | dropdownMenus[j].style.display = 'none'; | ||
+ | dropdownMenus[i].style.display = 'block'; | ||
+ | } | ||
+ | } else { | ||
+ | for (let j = 0 ; j < dropdownBoxs.length ; j ++) { | ||
+ | dropdownMenus[j].style.display = 'none'; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | |||
+ | |||
+ | <script type="text/javascript"> | ||
+ | |||
+ | var a= function() { | ||
+ | var box01 = document.getElementById("lists-DB"); | ||
+ | var lis = document.getElementById("lists");//获得轮播图图片盒子 | ||
+ | var btns = document.getElementById("buttons");//获得按钮盒子 | ||
+ | var imgs = lis.getElementsByTagName("img");//获得图片伪数组 | ||
+ | btns.style.width = 24 * (imgs.length - 2) + "px"; | ||
+ | btns.style.marginLeft = -(12 * (imgs.length - 2)) + "px";//动态赋值 | ||
+ | for(var i = 0;i < imgs.length - 2; i++){ | ||
+ | //动态生成小圆点 | ||
+ | var span = document.createElement("span"); | ||
+ | btns.appendChild(span); | ||
+ | } | ||
+ | |||
+ | |||
+ | //轮播图正式部分 | ||
+ | var prev = document.getElementById("arr-l"); | ||
+ | var next = document.getElementById("arr-r"); | ||
+ | var animated = false;//防止计时器多次被触发变量 | ||
+ | |||
+ | function animate(offset) { | ||
+ | var time = 300;//滚动一张图片总用时 | ||
+ | var inteval = 10;//滚动一次的间隔时间 | ||
+ | var speed = offset / (time / inteval);//每次滚动滑动的像素 | ||
+ | var left = parseInt(lis.style.left) + offset;//先计算出滚动后的left值 | ||
+ | function go() { | ||
+ | animated = true;//为true代表正在运行 | ||
+ | //滑动函数 | ||
+ | if(((speed > 0) + (parseInt(lis.style.left) < left)===2) || ((speed < 0) + (parseInt(lis.style.left)) > left===2)){ | ||
+ | lis.style.left = parseInt(lis.style.left) + speed + "px"; | ||
+ | setTimeout(go,inteval);//设置计时器 | ||
+ | } | ||
+ | else { | ||
+ | lis.style.left = left + "px"; | ||
+ | if(parseInt(lis.style.left) > -1000) lis.style.left = -(1000 * (imgs.length - 2)) + "px"; | ||
+ | if(parseInt(lis.style.left) < -(1000 * (imgs.length - 2))) lis.style.left = -1000 + "px"; | ||
+ | animated = false;//结束运行 | ||
+ | } | ||
+ | } | ||
+ | go();//调用函数 | ||
+ | |||
+ | } | ||
+ | prev.onclick = function() { | ||
+ | if(animated) return;//正在轮播停止 | ||
+ | if(index == 0) index = spans.length - 1; | ||
+ | else index --; | ||
+ | animate(1000); | ||
+ | showButton(); | ||
+ | } | ||
+ | next.onclick = function() { | ||
+ | if(animated) return; | ||
+ | if(index == spans.length - 1) index = 0; | ||
+ | else index ++; | ||
+ | animate(-1000); | ||
+ | showButton(); | ||
+ | } | ||
+ | var index = 0;//记录现在className为on的按钮 | ||
+ | |||
+ | var spans = btns.getElementsByTagName("span");//得到btns下所有的span标签 | ||
+ | spans[0].className = "on"; | ||
+ | for(var i = 0;i < spans.length;i ++ ) { | ||
+ | spans[i].index = i;//自定义属性 | ||
+ | spans[i].onclick = function() { | ||
+ | if(animated) return; | ||
+ | if(this.className == "on") return; | ||
+ | animate((index - this.index) * 1000); | ||
+ | index = this.index; | ||
+ | showButton(); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | function showButton() { //显示按钮运动的函数 | ||
+ | for(var j = 0;j < spans.length;j ++) {//排它思想 | ||
+ | //if(spans[j].className == "on") oldIndex = j; | ||
+ | spans[j].className = ""; | ||
+ | spans[index].className = "on"; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var timer;//计时器变量 , 这里为什么不能为null | ||
+ | var interval = 3000;//点击间隔时间 | ||
+ | |||
+ | function play() {//自动点击next函数 | ||
+ | timer = setTimeout(function(){ | ||
+ | next.onclick();//自动点击next | ||
+ | play();//递归调用 | ||
+ | },interval); | ||
+ | } | ||
+ | |||
+ | function stop() { | ||
+ | //停止函数 | ||
+ | clearTimeout(timer); | ||
+ | } | ||
+ | |||
+ | |||
+ | box01.onmouseover = stop; //鼠标悬浮在轮播图上时停止 | ||
+ | box01.onmouseout = play;//鼠标离开轮播图继续 | ||
+ | play();//先自己调用一次 | ||
+ | } | ||
+ | a(); | ||
+ | </script> | ||
+ | <script type="text/javascript"> | ||
+ | //封装函数js文件,方便调用 | ||
+ | function $(id) {return document.getElementById(id);}//封装获取id对象函数 | ||
+ | function show(obj) {obj.style.display = "block";}//封装显示函数 | ||
+ | function hidden(obj) {obj.style.display = "none";}//封装隐藏函数 | ||
+ | function scroll(){ | ||
+ | if(window.pageYOffset != null) { | ||
+ | //ie9+ 和 其他浏览器 | ||
+ | return { | ||
+ | top: window.pageYOffset, | ||
+ | left: window.pageXOffset | ||
+ | } | ||
+ | } | ||
+ | else if(document.compatMode == "CSS1Compat") { | ||
+ | //非怪异浏览器:没有头部的 | ||
+ | return { | ||
+ | top: document.documentElement.scrollTop, | ||
+ | left: document.documentElement.scrollLeft | ||
+ | } | ||
+ | } | ||
+ | return {//剩下的全部都是怪异浏览器 | ||
+ | top: document.body.scrollTop, | ||
+ | left: document.body.scrollLeft | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var leader = 0,target = 0,timer = null;//计时器变量 | ||
+ | window.onscroll = function() { | ||
+ | //滚动时执行的函数 | ||
+ | scroll().top > 0 ? show($("toTop")) : hidden($("toTop"));//隐藏和显示totop | ||
+ | leader = scroll().top; //实时记录滚动距离 | ||
+ | } | ||
+ | |||
+ | $("toTop").onclick = function() { | ||
+ | //toTop被点击时执行的函数 | ||
+ | target = 0; | ||
+ | timer = setInterval(function() { | ||
+ | leader = leader + (target - leader) / 10; | ||
+ | window.scrollTo(0,leader); | ||
+ | if(leader == target) clearInterval(timer);//当到达顶端清除计时器 | ||
+ | //必须写在里面,因为在计时器执行时判断 | ||
+ | },20); | ||
+ | } | ||
+ | |||
+ | </script> | ||
</html> | </html> |
Revision as of 13:43, 23 September 2018
Those students who study science alone are all in their final semester of a four-year degree, and have taken various courses in microbiology, molecular and cell biology as well as genetics, and similar fields at the South China Agricultural University (SCAU). And they also learned a lot of special skill to make themselves a qualified iGEMers.
WEITENG XU: He set up the SCAU-iGEM 2018 team and served as the captain, not only for wet experiment, but also for our iGEM project.
WEIXU WANG (KEN): He had a self-taught bioinformatics skill and was in charge of the mathematic model part of our project.
YINPIN HUANG: She was responsible for planning and organizing the human practices works (social activities, education and entrepreneurships), and she also handled the molecular cloning experiments.
YINGLI LI (LILY): She worked mostly on the molecular cloning, and she constructed of the expression vector with Yinpin Huang. Lily also was responsible for the work about lab safety.
WEI WANG/ YAOHUA HUANG: They were charge in the cyanobacteria transformation and confirmed the modeling predicting result showed by Ken.
XINYU ZHANG (DAISY): She was participated in news reports and art design of our team, and she had donated so many beautiful ideas.
JIAHUA ZOU (KAWAH): She was the designer of our team, had designed including the logo, team flag, team uniform, poster, banner and other promotional items.
JIADONG LI/XINLIN HUANG: They worked together to accomplish the design and construction of WiKi contents.
Dr HAO WANG: Our mentor, professor Hao Wang gave us advice and suggestion, and our team members can talk with him , search for his help anytime when we met difficulty to ensure that there would be consistency in our project.
iGEM Counselor Committee of SCAU: Professors Yaoguang Liu, Yiqun Deng, Gang Hao, Haihong Wang, Jikai Wen, Guohui Zhu and Ms Dongmei He, all of them were responsible and selfless to help us to make iGEM possible.
The training of iGEM and synthetic biology was also done on the go as the project progressed with the help of our advisors, XXX and XXX.
Our project was supported by grants from the Institute of Innovation & Entrepreneurship, the College of Life Sciences, Department of Foreign Affairs of SCAU.
The College of Life Sciences of SCAU: The college had provided us with an opening molecular laboratory where is our daily operation bench, a meeting room for our discussion, a plant culture room for the culture of cyanobacteria and a bacterial operation room for the bacterial safety operation.
State Key Laboratory for Conservation and Utilization of Subtropical Agro-bioresources (SKL-CUSA): Thank to the advanced machines and mature methods provided by them and we can finish the experiments smoothly.
Institute of Hydrobiology, Chinese Academy of Sciences: They Sent us with the cyanobacteria :Synechocystis sp. (FACHB-898), Scytonema javanicum(FACHB-887), Microcoleus vaginatus(FACHB-253);
Qingdao Institute of Biomass Energy and Bioprocess Technology, Chinese Academy of Sciences: They gifted us with the cyanobacterial expression vector pFQ20.
iGEM Team TUST-CHINA(2017): Thanks for the protocol of bacteria genome extraction.
During the human practices, we received many assistances and cooperation from people and organizations.
Gansu Desert control Research Institute: They provided us with the valuable environmental data of desert and sand sample from Gansu province for our simulation experiment.
The Youth League Committee of SCAU: for Bauhinia Scientific & Cultural Festival, public education and popular science, the support of Graffiti Wall.
The College of Life Sciences of SCAU: for the help of Laboratory Open days.
GZHS-united(2018)/GDSYZX(2018): We help them to organize the iGEM team and we had cooperation with them in interlab experiment.
iGEM Team: SYSU-China(2017)/ SYSU-Software (2017)/SCUT-ChinaA(2018)/NEU-ChinaB(2018)/ SUSTech_Shenzhen(2018)/FAFU-CHINA(2017) for the collaboration, communications, cooperation and iGEM gathering.
SCAU Affiliated Primary school: for education courses of Biology.
School's name:SCAU
Member's name:SCAU
Designed by:SCAU