Difference between revisions of "Team:China Tongji"

Line 3: Line 3:
 
<html>
 
<html>
 
<head>
 
<head>
−
<!-- load css files -->
 
−
<link href="https://2015.igem.org/Team:China_Tongji/flexSlider_css?action=raw&ctype=text/css" rel="stylesheet">
 
 
<style type="text/css">
 
<style type="text/css">
 
#content {
 
#content {
Line 35: Line 33:
 
text-align: justify;
 
text-align: justify;
 
text-indent: 2%;
 
text-indent: 2%;
−
font-size: 20px;
+
font-size: 18px;
−
font-family: "Palatino Linotype", "MS Serif", "Times New Roman",Georgia, Times, "Book Antiqua";
+
font-family: "Times New Roman",Georgia, Times, "Book Antiqua","MS Serif";
 
text-decoration: none;
 
text-decoration: none;
 +
width:100%;
 
}
 
}
 
#mainContent .divider{
 
#mainContent .divider{
Line 48: Line 47:
 
clear:both;
 
clear:both;
 
}
 
}
−
/* 滚动图片样download */
+
/* 滚动图片样式*/
−
.flexslider {
+
#oneMorePic{
−
height: 400px;
+
width: 100%;
−
border:solid thin #666;
+
height: 350px;
 +
background:url(https://static.igem.org/mediawiki/2015/c/c9/China_Tongji-homePicture-1.png);
 +
margin: 20px 0px;
 +
border:solid 2px #666;
 +
}
 +
.picBackground{
 +
clear:both;
 +
position:absolute;
 +
}
 +
.picMove{
 +
width:50px;
 +
height:50px;
 +
opacity:0.7;
 +
margin-top:160px;
 +
}
 +
#moveLeft{
 +
float:left;
 +
margin-left:20px;
 +
}
 +
#moveRight{
 +
float:right;
 +
margin-right:20px;
 +
}
 +
.button:hover{
 +
cursor:pointer;
 +
opacity:0.9;
 +
}
 +
.picPosition{
 +
position:absolute;
 +
margin-left:480px;
 +
margin-top:320px;
 +
z-index:100;
 +
}
 +
.picPositionIndex{
 +
width:15px;
 +
height:15px;
 +
opacity:0.6;
 +
margin:5px;
 
}
 
}
−
.flexslider .slides a img {
+
#picPosition1{
−
height: 400px;
+
opacity:0.9;
−
}
+
}
 
/* 标题按钮样式 */
 
/* 标题按钮样式 */
 
.titleButton{
 
.titleButton{
 
float: left;
 
float: left;
−
margin:15px 16.667px;
+
margin:5px 0px;
−
width:300px;
+
−
height:300px;
+
 
}
 
}
 
#buttonProject{
 
#buttonProject{
−
background: url(https://static.igem.org/mediawiki/2015/9/9a/China-Tongji-projectBugButton.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/8/84/China_Tongji-project.png) no-repeat;
−
background-size:300px 300px;
+
 
}
 
}
 
#buttonNotebook{
 
#buttonNotebook{
−
background: url(https://static.igem.org/mediawiki/2015/0/07/China-Tongji-notebookBugButton.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/b/be/China_Tongji-notebook.png) no-repeat;
−
background-size:300px 300px;
+
 
}
 
}
 
#buttonAchivement{
 
#buttonAchivement{
−
background: url(https://static.igem.org/mediawiki/2015/2/2a/China-Tongji-achievementBugButton.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/3/3b/China_Tongji-achivement.png) no-repeat;
−
background-size:300px 300px;
+
−
}
+
−
#buttonTeam{
+
−
background: url(https://static.igem.org/mediawiki/2015/3/3e/China-Tongji-teamBugButton.png) no-repeat;
+
−
background-size:300px 300px;
+
 
}
 
}
 
#buttonOutreach{
 
#buttonOutreach{
−
background: url(https://static.igem.org/mediawiki/2015/e/e4/China-Tongji-outreachBugButton.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/0/09/China_Tongji-outreach.png) no-repeat;
−
background-size:300px 300px;
+
 
}
 
}
 
#buttonSafety{
 
#buttonSafety{
−
background: url(https://static.igem.org/mediawiki/2015/7/7b/China-Tongji-safetyBugButton.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/3/37/China_Tongji-safety.png) no-repeat;
−
background-size:300px 300px;
+
 
}
 
}
 
.titleButton a{
 
.titleButton a{
−
font-family: "Comic Sans MS", cursive, Tahoma, Arial, Helvetica;
+
font-family: Tahoma, Arial, Helvetica;
−
font-size: 42px;
+
font-size: 26px;
−
font-weight: bolder;
+
font-weight: bold;
−
color: #FFF;
+
color: #333;
 
display:block;
 
display:block;
−
width:100%;
+
width:200px;
−
height:100%;
+
height:172px;
 
text-align: center;
 
text-align: center;
−
padding-top:32px;
+
padding-top:28px;
−
}
+
  opacity:0.80;
−
.titleButton:hover{
+
−
opacity:0.75;
+
 
}
 
}
 
.titleButton a:hover{
 
.titleButton a:hover{
 +
opacity:1;
 
text-decoration: none;
 
text-decoration: none;
 
}
 
}
Line 120: Line 144:
 
</style>
 
</style>
 
</head>
 
</head>
 +
 
<body onLoad="endTime()">
 
<body onLoad="endTime()">
 
<!--content start-->
 
<!--content start-->
Line 125: Line 150:
 
     <div id=mainContent>
 
     <div id=mainContent>
 
     <!-- maincontent start here -->
 
     <!-- maincontent start here -->
−
         <!-- 图片轮播 -->
+
         <!-- 滚动图片 -->
−
        <br><div class="fivePx"></div>
+
      <div id="oneMorePic">
−
        <div id="banner_tabsHead" class="flexslider">
+
        <img class="button picMove" id="moveLeft" src="https://static.igem.org/mediawiki/2015/d/d9/China_Tongji-picLeftMove.png">
−
            <ul class="slides">
+
            <img class="button picMove" id="moveRight" src="https://static.igem.org/mediawiki/2015/f/f3/China_Tongji-picRightMove.png">
−
                <li><img src="https://static.igem.org/mediawiki/2015/a/a0/China-Tongji-home-teamMembers.jpg"></li>
+
            <div class="picPosition">
−
                <li><img src="https://static.igem.org/mediawiki/2015/9/9b/China-Tongji-home-takeBug.jpg"></li>
+
            <img class="button picPositionIndex" id="picPosition1" src="https://static.igem.org/mediawiki/2015/2/2c/China_Tongji-picPosition.png">
−
                <li><img src="https://static.igem.org/mediawiki/2015/d/d5/China-Tongji-home-oneMicroscope.jpg"></li>
+
                <img class="button picPositionIndex" id="picPosition2"  src="https://static.igem.org/mediawiki/2015/2/2c/China_Tongji-picPosition.png">
−
                <li><img src="https://static.igem.org/mediawiki/2015/6/63/China-Tongji-home-oneBug.jpg"></li>
+
             </div>
−
                <li><img src="https://static.igem.org/mediawiki/2015/6/67/China-Tongji-home-multiBug.jpg"></li>
+
−
                <li><img src="https://static.igem.org/mediawiki/2015/7/79/China-Tongji-home-making.jpg"></li>
+
−
             </ul>
+
−
            <ul class="flex-direction-nav">
+
−
                <li><a class="flex-prev" href="javascript:;">Previous</a></li>
+
−
                <li><a class="flex-next" href="javascript:;">Next</a></li>
+
−
            </ul>
+
−
            <ol id="bannerCtrlHead" class="flex-control-nav flex-control-paging">
+
−
                <li class="active"><a>1</a></li>
+
−
                <li class=""><a>2</a></li>
+
−
                <li class=""><a>3</a></li>
+
−
                <li class=""><a>4</a></li>
+
−
                <li class=""><a>5</a></li>
+
−
                <li class=""><a>6</a></li>
+
−
            </ol>
+
 
         </div>
 
         </div>
 
         <!-- 倒计时块 -->
 
         <!-- 倒计时块 -->
Line 153: Line 163:
 
         <!-- 一级标题块 -->
 
         <!-- 一级标题块 -->
 
         <div class="titleOneBlock">
 
         <div class="titleOneBlock">
−
         <div class="titleButton" id="buttonProject"><a href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></div>
+
         <div class="titleButton"><a id="buttonProject" href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></div>
−
           <div class="titleButton" id="buttonNotebook"><a href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></div>
+
           <div class="titleButton"><a id="buttonNotebook" href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></div>
−
           <div class="titleButton" id="buttonAchivement"><a href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a></div>
+
           <div class="titleButton"><a id="buttonAchivement" href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a></div>
−
           <div class="titleButton" id="buttonTeam"><a href="https://2015.igem.org/Team:China_Tongji/Team">Team</a></div>
+
           <div class="titleButton"><a id="buttonOutreach" href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></div>
−
          <div class="titleButton" id="buttonOutreach"><a href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></div>
+
           <div class="titleButton"><a id="buttonSafety" href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></div>
−
           <div class="titleButton" id="buttonSafety"><a href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></div>
+
 
         </div>
 
         </div>
 
         <!-- 项目介绍 -->
 
         <!-- 项目介绍 -->
Line 182: Line 191:
 
</div>
 
</div>
  
−
<!-- ------------javascript code ----------------- -->
+
 
−
<!-- Load javascript code -->
+
−
<script src="https://2015.igem.org/Team:China_Tongji/slider_js?action=raw"></script>
+
 
<script type="text/javascript">
 
<script type="text/javascript">
−
//文档就绪时触发
 
 
jQuery(document).ready(function($){
 
jQuery(document).ready(function($){
−
//单击导航栏后跳转到指定面
+
//修改导航栏中下拉菜单中a标签的href属
−
$('#divProject').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Project"; });
+
$('#divProject .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Project");
−
$('#divNotebook').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Notebook"; });
+
$('#divNotebook .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Notebook");
−
$('#divAchivement').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Achivement"; });
+
$('#divAchivement .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Achivement");
−
$('#divTeam').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Team"; });
+
$('#divTeam .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Team");
−
$('#divOutreach').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Outreach"; });
+
$('#divOutreach .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Outreach");
−
//head图片轮播
+
//图片切换
−
$(function() { //$(document).ready(function(){...})的简写形式
+
$('#picPosition1').click(function(){
−
var bannerSlider = new Slider($('#banner_tabsHead'), {
+
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/c9/China_Tongji-homePicture-1.png)");
−
time: 3000,
+
$('#picPosition1').css("opacity","0.9");
−
delay: 400,
+
$('#picPosition2').css("opacity","0.6");
−
event: 'hover',
+
−
auto: true,
+
−
mode: 'fade',
+
−
controller: $('#bannerCtrlHead'),
+
−
activeControllerCls: 'active'
+
 
});
 
});
−
$('#banner_tabsHead .flex-prev').click(function() {
+
$('#picPosition2').click(function(){
−
bannerSlider.prev()
+
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/cb/China_Tongji-homePicture-3.png)");
 +
$('#picPosition2').css("opacity","0.9");
 +
$('#picPosition1').css("opacity","0.6");
 
});
 
});
−
$('#banner_tabsHead .flex-next').click(function() {
+
$('#moveLeft,#moveRight').click(changePic);
−
bannerSlider.next()
+
//鼠标移动到图片上时，停止自动切换
−
});
+
$('#oneMorePic').mouseover(function(){
−
});
+
clearInterval(timer);
 +
})
 +
//鼠标离开图片后，继续自动切换
 +
$('#oneMorePic').mouseleave(function(){
 +
timer = setInterval('changePic()',intervalTimes);  
 +
})
  
 
});
 
});
 +
//图片切换
 +
var picIndex = 1;
 +
var intervalTimes = 3000;
 +
function changePic(){
 +
if(picIndex == 1){
 +
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/cb/China_Tongji-homePicture-3.png)");
 +
$('#picPosition2').css("opacity","0.9");
 +
$('#picPosition1').css("opacity","0.6");
 +
picIndex = 2;
 +
}else{
 +
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/c9/China_Tongji-homePicture-1.png)");
 +
$('#picPosition1').css("opacity","0.9");
 +
$('#picPosition2').css("opacity","0.6");
 +
picIndex = 1;}
 +
}
 +
var timer = setInterval('changePic()',intervalTimes);  //自动切换图片
 +
 
//倒计时模块代码
 
//倒计时模块代码
 
var today;
 
var today;
Line 246: Line 271:
 
setTimeout('endTime()',1000);
 
setTimeout('endTime()',1000);
 
}
 
}
−
//个位数前加0
+
function checkTime(i) //个位数前加0
−
function checkTime(i)  
+
 
{
 
{
 
if (i<10){
 
if (i<10){

Revision as of 13:33, 4 September 2015

0 days 00:00:00 left to iGEM 2015 Wiki Freeze!
Project
Notebook
Achivement
Outreach
Safety

Project Introduction

In our project, we will use the technology of optogenetic and use light of different wave produced by the special light source assembled by ourselves to control the moving of C.elegans, construct a movement controlling system and bulid an amusement park of C.elegans.

We will try to design our special parts and express channalrhodopsin in specific C.elegans' neurons. To accomplish our goals to express channalrhodopsin in single neuron, we make the use of cre- loxp system and the overlapping of promoters. We not only use the traditional channalrhodopsin,chR2,but also try to express the novel channelrhodopsin, Blink, and other fancy channelrhodopsins which have never been tested in C.elegans.

And we will also get some parts and assemble those parts into a new equipment which can serves as the light source of our experiment.Then we will use computer controlling that lightsource to change the light which can activate or suppress the channelrhodopsin. By doing that, we can try to control the behaviours of C.elegans such as moving forwards or twisting more effectively.

What's more,we will express GFP,YFP,mcherry in E.coli. By combining the color of microorgasims and C.elegans, we want to construct some interesting scenes to form a C.elegans' fancy world.

This technology will be helpful in the research on neuron's function and interaction. In the future, this technology may also be used in mechanical controlling system and the theraphy of movement defect.

Video Appreciation


Home| Project| Notebook| Achivement| Team| Outreach| Safety

Copyright © China_Tongji iGEM 2015 | Developer: LiJunWu