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 33: Line 35:
 
text-align: justify;
 
text-align: justify;
 
text-indent: 2%;
 
text-indent: 2%;
−
font-size: 18px;
+
font-size: 20px;
−
font-family: "Times New Roman",Georgia, Times, "Book Antiqua","MS Serif";
+
font-family: "Palatino Linotype", "MS Serif", "Times New Roman",Georgia, Times, "Book Antiqua";
 
text-decoration: none;
 
text-decoration: none;
−
width:100%;
 
 
}
 
}
 
#mainContent .divider{
 
#mainContent .divider{
Line 47: Line 48:
 
clear:both;
 
clear:both;
 
}
 
}
−
/* 滚动图片样式*/
+
/* 滚动图片样download */
−
#oneMorePic{
+
.flexslider {
−
width: 100%;
+
height: 400px;
−
height: 350px;
+
border:solid thin #666;
−
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;
+
 
}
 
}
−
#picPosition1{
+
.flexslider .slides a img {
−
opacity:0.9;
+
height: 400px;
−
}
+
}
 
/* 标题按钮样式 */
 
/* 标题按钮样式 */
 
.titleButton{
 
.titleButton{
 
float: left;
 
float: left;
−
margin:5px 0px;
+
margin:15px 16.667px;
 +
width:300px;
 +
height:300px;
 
}
 
}
 
#buttonProject{
 
#buttonProject{
−
background: url(https://static.igem.org/mediawiki/2015/8/84/China_Tongji-project.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/9/9a/China-Tongji-projectBugButton.png) no-repeat;
 +
background-size:300px 300px;
 
}
 
}
 
#buttonNotebook{
 
#buttonNotebook{
−
background: url(https://static.igem.org/mediawiki/2015/b/be/China_Tongji-notebook.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/0/07/China-Tongji-notebookBugButton.png) no-repeat;
 +
background-size:300px 300px;
 
}
 
}
 
#buttonAchivement{
 
#buttonAchivement{
−
background: url(https://static.igem.org/mediawiki/2015/3/3b/China_Tongji-achivement.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/2/2a/China-Tongji-achievementBugButton.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/0/09/China_Tongji-outreach.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/e/e4/China-Tongji-outreachBugButton.png) no-repeat;
 +
background-size:300px 300px;
 
}
 
}
 
#buttonSafety{
 
#buttonSafety{
−
background: url(https://static.igem.org/mediawiki/2015/3/37/China_Tongji-safety.png) no-repeat;
+
background: url(https://static.igem.org/mediawiki/2015/7/7b/China-Tongji-safetyBugButton.png) no-repeat;
 +
background-size:300px 300px;
 
}
 
}
 
.titleButton a{
 
.titleButton a{
−
font-family: Tahoma, Arial, Helvetica;
+
font-family: "Comic Sans MS", cursive, Tahoma, Arial, Helvetica;
−
font-size: 26px;
+
font-size: 42px;
−
font-weight: bold;
+
font-weight: bolder;
−
color: #333;
+
color: #FFF;
 
display:block;
 
display:block;
−
width:200px;
+
width:100%;
−
height:172px;
+
height:100%;
 
text-align: center;
 
text-align: center;
−
padding-top:28px;
+
padding-top:32px;
−
  opacity:0.80;
+
}
 +
.titleButton:hover{
 +
opacity:0.75;
 
}
 
}
 
.titleButton a:hover{
 
.titleButton a:hover{
−
opacity:1;
 
 
text-decoration: none;
 
text-decoration: none;
 
}
 
}
Line 144: Line 120:
 
</style>
 
</style>
 
</head>
 
</head>
−
 
 
<body onLoad="endTime()">
 
<body onLoad="endTime()">
 
<!--content start-->
 
<!--content start-->
Line 150: Line 125:
 
     <div id=mainContent>
 
     <div id=mainContent>
 
     <!-- maincontent start here -->
 
     <!-- maincontent start here -->
−
         <!-- 滚动图片 -->
+
         <!-- 图片轮播 -->
−
      <div id="oneMorePic">
+
        <br><div class="fivePx"></div>
−
        <img class="button picMove" id="moveLeft" src="https://static.igem.org/mediawiki/2015/d/d9/China_Tongji-picLeftMove.png">
+
        <div id="banner_tabsHead" class="flexslider">
−
            <img class="button picMove" id="moveRight" src="https://static.igem.org/mediawiki/2015/f/f3/China_Tongji-picRightMove.png">
+
            <ul class="slides">
−
            <div class="picPosition">
+
                <li><img src="https://static.igem.org/mediawiki/2015/a/a0/China-Tongji-home-teamMembers.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/9/9b/China-Tongji-home-takeBug.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/d/d5/China-Tongji-home-oneMicroscope.jpg"></li>
−
             </div>
+
                <li><img src="https://static.igem.org/mediawiki/2015/6/63/China-Tongji-home-oneBug.jpg"></li>
 +
                <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 163: Line 153:
 
         <!-- 一级标题块 -->
 
         <!-- 一级标题块 -->
 
         <div class="titleOneBlock">
 
         <div class="titleOneBlock">
−
         <div class="titleButton"><a id="buttonProject" href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></div>
+
         <div class="titleButton" id="buttonProject"><a href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></div>
−
           <div class="titleButton"><a id="buttonNotebook" href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</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="buttonAchivement" href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</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="buttonOutreach" href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</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="buttonSafety" href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></div>
+
          <div class="titleButton" id="buttonOutreach"><a href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></div>
 +
           <div class="titleButton" id="buttonSafety"><a href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></div>
 
         </div>
 
         </div>
 
         <!-- 项目介绍 -->
 
         <!-- 项目介绍 -->
Line 191: Line 182:
 
</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 .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Project");
+
$('#divProject').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Project"; });
−
$('#divNotebook .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Notebook");
+
$('#divNotebook').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Notebook"; });
−
$('#divAchivement .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Achivement");
+
$('#divAchivement').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Achivement"; });
−
$('#divTeam .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Team");
+
$('#divTeam').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Team"; });
−
$('#divOutreach .navDrop .navTwo a').attr("href","https://2015.igem.org/Team:China_Tongji/Outreach");
+
$('#divOutreach').click(function(){ location.href="https://2015.igem.org/Team:China_Tongji/Outreach"; });
−
//图片切换
+
//head图片轮播
−
$('#picPosition1').click(function(){
+
$(function() { //$(document).ready(function(){...})的简写形式
−
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/c9/China_Tongji-homePicture-1.png)");
+
var bannerSlider = new Slider($('#banner_tabsHead'), {
−
$('#picPosition1').css("opacity","0.9");
+
time: 3000,
−
$('#picPosition2').css("opacity","0.6");
+
delay: 400,
 +
event: 'hover',
 +
auto: true,
 +
mode: 'fade',
 +
controller: $('#bannerCtrlHead'),
 +
activeControllerCls: 'active'
 
});
 
});
−
$('#picPosition2').click(function(){
+
$('#banner_tabsHead .flex-prev').click(function() {
−
$('#oneMorePic').css("background","url(https://static.igem.org/mediawiki/2015/c/cb/China_Tongji-homePicture-3.png)");
+
bannerSlider.prev()
−
$('#picPosition2').css("opacity","0.9");
+
−
$('#picPosition1').css("opacity","0.6");
+
 
});
 
});
−
$('#moveLeft,#moveRight').click(changePic);
+
$('#banner_tabsHead .flex-next').click(function() {
−
//鼠标移动到图片上时，停止自动切换
+
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 271: Line 246:
 
setTimeout('endTime()',1000);
 
setTimeout('endTime()',1000);
 
}
 
}
−
function checkTime(i) //个位数前加0
+
//个位数前加0
 +
function checkTime(i)  
 
{
 
{
 
if (i<10){
 
if (i<10){

Revision as of 13:34, 4 September 2015


0 days 00:00:00 left to iGEM 2015 Wiki Freeze!

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