Line 603: | Line 603: | ||
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Content begins ---------------------------------------------------------------------------------------------------------------------------------> | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Content begins ---------------------------------------------------------------------------------------------------------------------------------> | ||
<!----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | <!----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | ||
− | |||
Line 790: | Line 789: | ||
color:white; | color:white; | ||
display:block; | display:block; | ||
+ | margin-top:10%; | ||
+ | margin-bottom:7%; | ||
} | } | ||
.title2{ | .title2{ | ||
Line 850: | Line 851: | ||
display:block; | display:block; | ||
margin-left:25%; | margin-left:25%; | ||
+ | } | ||
+ | .legend{ | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | .legend>div{ | ||
+ | width:100%; | ||
+ | text-align:center!important; | ||
+ | } | ||
+ | .legends{ | ||
+ | margin:auto 15%; | ||
} | } | ||
Line 1,324: | Line 1,336: | ||
</li> | </li> | ||
− | <li class="navLi"><a class="navA noSubmenu" href="https:// | + | <li class="navLi"><a class="navA noSubmenu" href="https://igem.org/2019_Judging_Form?id=3257">Judging</a></li> |
</ul> | </ul> | ||
Line 1,377: | Line 1,389: | ||
#demoCover{ | #demoCover{ | ||
width:100vw; | width:100vw; | ||
− | height: | + | height:80vh; |
position:absolute; | position:absolute; | ||
background-color:rgba(8,39,58,0.5); | background-color:rgba(8,39,58,0.5); | ||
− | top: | + | top:70px; |
left:0; | left:0; | ||
text-align:center; | text-align:center; | ||
Line 1,386: | Line 1,398: | ||
#coverPic{ | #coverPic{ | ||
width:550px; | width:550px; | ||
− | margin: | + | margin:20vh auto; |
} | } | ||
#demo{ | #demo{ | ||
width:100vw; | width:100vw; | ||
− | height: | + | height:70vh; |
position:relative; | position:relative; | ||
} | } | ||
Line 1,412: | Line 1,424: | ||
#demoCover{ | #demoCover{ | ||
top:55px; | top:55px; | ||
+ | height:30vh; | ||
} | } | ||
#demo{ | #demo{ | ||
Line 1,810: | Line 1,823: | ||
<li class="leftNavLi2"><a class="leftNavA2" href="#mainTitle3_2">Sequence specificity</a></li> | <li class="leftNavLi2"><a class="leftNavA2" href="#mainTitle3_2">Sequence specificity</a></li> | ||
<li class="leftNavLi2"><a class="leftNavA2" href="#mainTitle3_3">Host adaptability</a></li> | <li class="leftNavLi2"><a class="leftNavA2" href="#mainTitle3_3">Host adaptability</a></li> | ||
+ | <li class="leftNavLi2" style="display:none;"><a class="leftNavA2" href="#mainTitle3_4"></a></li> | ||
</ul> | </ul> | ||
</li> | </li> | ||
Line 1,821: | Line 1,835: | ||
.leftNav{ | .leftNav{ | ||
position: absolute; | position: absolute; | ||
− | top: | + | top:30vw; |
left:4%; | left:4%; | ||
list-style: none; | list-style: none; | ||
Line 1,928: | Line 1,942: | ||
<div class="col">Moloney murine leukemia virus reverse transcriptase</div> | <div class="col">Moloney murine leukemia virus reverse transcriptase</div> | ||
</div> | </div> | ||
+ | |||
+ | <div class="row legend"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/4/43/T--Fudan-TSI--4mh8.gif" style="width:30%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 1. Crystal structure of MMLV reverse transcriptase (PDB:4MH8). | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
<div class="row title3"> | <div class="row title3"> | ||
<div class="col"><i>Why MMLV?</i></div> | <div class="col"><i>Why MMLV?</i></div> | ||
</div> | </div> | ||
+ | |||
<div class="row para1"> | <div class="row para1"> | ||
Line 1,977: | Line 2,002: | ||
Apart from using the native tRNAPro, which requires an additional PBS outside the target sequence, we have designed a software tool which can design novel tRNAs aligning with the target sequence. | Apart from using the native tRNAPro, which requires an additional PBS outside the target sequence, we have designed a software tool which can design novel tRNAs aligning with the target sequence. | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row legend" style="margin-bottom:10%;"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/9/9a/T--Fudan-TSI--designRT.gif" style="width:70%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 2. | ||
</div> | </div> | ||
</div> | </div> | ||
Line 2,038: | Line 2,072: | ||
<div class="row title2" id="mainTitle2_1"> | <div class="row title2" id="mainTitle2_1"> | ||
<div class="col">Cre recombinase</div> | <div class="col">Cre recombinase</div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row legend"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/f/f7/T--Fudan-TSI--3mgv.gif" style="width:30%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 3. Crystal structure of Cre recombinase bound to a loxP holliday junction (PDB:3MGV). | ||
+ | </div> | ||
</div> | </div> | ||
Line 2,062: | Line 2,105: | ||
<div class="row title2" id="mainTitle2_3"> | <div class="row title2" id="mainTitle2_3"> | ||
<div class="col">Cre mutation and alternative versions</div> | <div class="col">Cre mutation and alternative versions</div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row legend"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/e/ee/T--Fudan-TSI--creVersions.gif" style="width:50%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 4. | ||
+ | </div> | ||
</div> | </div> | ||
Line 2,090: | Line 2,142: | ||
EGFP is put under the ptetR promoter in place of Cre, and its fluorescence level is measured.<br /><br /> | EGFP is put under the ptetR promoter in place of Cre, and its fluorescence level is measured.<br /><br /> | ||
Cre is co-transformed with another plasmid containing a stably expressed mCherry with two wildtype loxP sites flanking. Afterwards the whole sequence is amplified through PCR, and if Cre is in the system, mCherry would be spliced from its plasmid, and the amplification result would be a short sequence, while the non-spliced mCherry would be fully amplified. | Cre is co-transformed with another plasmid containing a stably expressed mCherry with two wildtype loxP sites flanking. Afterwards the whole sequence is amplified through PCR, and if Cre is in the system, mCherry would be spliced from its plasmid, and the amplification result would be a short sequence, while the non-spliced mCherry would be fully amplified. | ||
− | |||
</div> | </div> | ||
</div> | </div> | ||
Line 2,116: | Line 2,167: | ||
<div class="row title3"> | <div class="row title3"> | ||
<div class="col"><i>Recombination event test</i></div> | <div class="col"><i>Recombination event test</i></div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row legend"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/6/6c/T--Fudan-TSI--creFunction.gif" style="width:90%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 5. | ||
+ | </div> | ||
</div> | </div> | ||
Line 2,130: | Line 2,190: | ||
<div class="row title2" id="mainTitle3_1"> | <div class="row title2" id="mainTitle3_1"> | ||
<div class="col">System verification</div> | <div class="col">System verification</div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row legend"> | ||
+ | <div class="row"> | ||
+ | <img src="https://static.igem.org/mediawiki/2019/6/6c/T--Fudan-TSI--designDemo.gif" style="width:90%; margin:auto;"> | ||
+ | </div> | ||
+ | <div class="row legends"> | ||
+ | Figure 6. | ||
+ | </div> | ||
</div> | </div> | ||
Line 2,158: | Line 2,227: | ||
</div> | </div> | ||
− | <div class="row title2" id="mainTitle4"> | + | <div class="row title2" id="mainTitle3_4"></div> |
+ | |||
+ | <div class="row title2" id="mainTitle4" style="margin-top:10%;"> | ||
<div class="col">References</div> | <div class="col">References</div> | ||
</div> | </div> | ||
Line 2,353: | Line 2,424: | ||
var winHeight=$(window).height(); | var winHeight=$(window).height(); | ||
var winWidth=$(window).width(); | var winWidth=$(window).width(); | ||
− | var pagePosition=$("#pageContent").offset().top; | + | var pagePosition=$("#pageContent").offset().top+90; |
var navHeight=$(".leftNav").height(); | var navHeight=$(".leftNav").height(); | ||
var footerHeight=$("#FudanFooter").height(); | var footerHeight=$("#FudanFooter").height(); | ||
Line 2,366: | Line 2,437: | ||
var maxTopDistance=$("#pageContent").height(); | var maxTopDistance=$("#pageContent").height(); | ||
var leftNavFromTop=pagePosition-$(window).scrollTop(); | var leftNavFromTop=pagePosition-$(window).scrollTop(); | ||
− | if (leftNavFromTop<0. | + | if (leftNavFromTop<0.25*winHeight){ |
if(topDistance<maxTopDistance){ | if(topDistance<maxTopDistance){ | ||
− | $(".leftNav").css({"position":"fixed","top":0. | + | $(".leftNav").css({"position":"fixed","top":0.25*winHeight+$("#top_menu_14").height()}); |
} | } | ||
else{ | else{ | ||
Line 2,384: | Line 2,455: | ||
var leftNavFromTop=pagePosition-$(window).scrollTop(); | var leftNavFromTop=pagePosition-$(window).scrollTop(); | ||
var topDistance=$(window).scrollTop(); | var topDistance=$(window).scrollTop(); | ||
− | if (leftNavFromTop<0. | + | if (leftNavFromTop<0.25*winHeight){ |
if(topDistance<maxTopDistance){ | if(topDistance<maxTopDistance){ | ||
− | $(".leftNav").css({"position":"fixed","top":0. | + | $(".leftNav").css({"position":"fixed","top":0.25*winHeight+$("#top_menu_14").height()}); |
} | } | ||
else{ | else{ |
Revision as of 18:31, 14 October 2019