Difference between revisions of "Team:Fudan-CHINA/Team"

(Replaced content with "<html> </html>")
Line 1: Line 1:
 +
{{Fudan-CHINA}}
 
<html>
 
<html>
 +
 +
<!--page-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 +
<div id="firstDiv">
 +
<img src="https://static.igem.org/mediawiki/2018/9/99/T--Fudan-CHINA--teamBgImg.jpg" />
 +
<div class="fiName">Team</div>
 +
<div class="pSentence">"All human wisdom is summed up in two words, wait and hope."</div>
 +
</div>
 +
<style>
 +
#firstDiv{
 +
width: 100%;
 +
height: 22vw;
 +
overflow: hidden;
 +
}
 +
#firstDiv img{
 +
filter: brightness(0.6);
 +
position: relative;
 +
width: 140%;
 +
top:50%;
 +
left:50%;
 +
transform: translateX(-43%) translateY(-30%);
 +
}
 +
    .fiName{
 +
color: white;
 +
font-family:Allura,_Allura;
 +
font-size: 5vw;
 +
font-weight: 600;
 +
position: absolute;
 +
top:15vw;
 +
right: 12vw;
 +
}
 +
.pSentence{
 +
color: white;
 +
font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
 +
font-size: 1.2vw;
 +
font-weight: 400;
 +
position: absolute;
 +
top:18vw;
 +
right: 12vw;
 +
}
 +
</style>
  
 +
<div class="members">
 +
<div class="memberTitle theDivTitle">
 +
MEMBERS
 +
</div>
 +
<div class="memberPhoto">
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/9/9c/T--Fudan-CHINA--JKF.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/5/5f/T--Fudan-CHINA--TZ_JKF.jpg">
 +
</div>
 +
<div class="memberName">Kaifeng Jin</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/6/67/T--Fudan-CHINA--ZZX1234.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/c/c7/T--Fudan-CHINA--TZ_ZZX.jpg">
 +
</div>
 +
<div class="memberName">Zixuan Zhang</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:-1vw;" class="memImg" src="https://static.igem.org/mediawiki/2018/5/5c/T--Fudan-CHINA--DLJ.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/c/cf/T--Fudan-CHINA--TZ_DLJ.jpg">
 +
</div>
 +
<div class="memberName">Leijie Dai</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/e/e7/T--Fudan-CHINA--WSH.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/8/8e/T--Fudan-CHINA--TZ_WSH.jpg">
 +
</div>
 +
<div class="memberName">Sihan Wang</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/d/d0/T--Fudan-CHINA--WXX.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/b/b6/T--Fudan-CHINA--TZ_WX.jpg">
 +
</div>
 +
<div class="memberName">Xin Wang</div>
 +
</div>
 +
<br>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/7/7e/T--Fudan-CHINA--ZYN.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/c/c1/T--Fudan-CHINA--TZ_ZYN.jpg">
 +
</div>
 +
<div class="memberName">Yineng Zhou</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:1vw;" class="memImg" src="https://static.igem.org/mediawiki/2018/f/f9/T--Fudan-CHINA--HCC.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/b/be/T--Fudan-CHINA--TZ_HHC.jpg">
 +
</div>
 +
<div class="memberName">Haichen Hu</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:-2vw;" class="memImg" src="https://static.igem.org/mediawiki/2018/8/86/T--Fudan-CHINA--WY.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/5/5c/T--Fudan-CHINA--TZ_WY.jpg">
 +
</div>
 +
<div class="memberName">Yi Wang</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img class="memImg" src="https://static.igem.org/mediawiki/2018/b/b1/T--Fudan-CHINA--WYFFF.jpg">
 +
<img class="memPic" src="https://static.igem.org/mediawiki/2018/3/3a/T--Fudan-CHINA--TZ_ZYF.jpg">
 +
</div>
 +
<div class="memberName">Yifan Wang</div>
 +
</div>
 +
</div>
 +
</div>
 +
<style>
 +
.theDivTitle{
 +
color: rgba(6,34,82,1);
 +
font-family: "Verlag Book",Arial,Helvetica;
 +
font-weight: 400;
 +
font-size: 3vw;
 +
padding:0;
 +
margin: 8vw 0 3vw 0;
 +
position: relative;
 +
text-align: center;
 +
}
 +
.theDivTitle:after {
 +
    content: "";
 +
    position: absolute;
 +
    width: 4vw;
 +
    height: 0.06vw;
 +
    background-color: rgba(6,34,82,1);
 +
    top:3.4vw;
 +
    left: 50%;
 +
    transform: translateX(-50%);
 +
}
 +
.memberTitle div{
 +
padding: 3vw 0 0 0;
 +
color: rgba(121,121,121,1);
 +
font-family:Jura;
 +
font-size: 1.4vw;
 +
}
 +
.memberPhoto{
 +
text-align: center;
 +
}
 +
.everyMem{
 +
display: inline-block;
 +
width:12vw;
 +
 +
margin:1vw 1.7vw;
 +
}
 +
.memImgDiv{
 +
width: 100%;
 +
height: 13vw;
 +
position: relative;
 +
overflow: hidden;
 +
}
 +
.memImgDiv img{
 +
position: absolute;
 +
transition: all 1s;
 +
transform: translateY(-10%);
 +
}
 +
.memImgDiv .memImg{
 +
width: 100%;
 +
top:0;
 +
left:0;
 +
}
 +
.memImgDiv .memPic{
 +
width: 100%;
 +
top:2vw;
 +
left: 0;
 +
background-color: white;
 +
transform: rotateY(180deg);
 +
}
 +
.memImgDiv:hover .memImg:not(.isor){
 +
transform: rotateY(180deg);
 +
}
 +
.memImgDiv:hover .memPic{
 +
transform: rotateY(360deg);
 +
}
 +
img.memImg{
 +
z-index: 5;
 +
backface-visibility: hidden;
 +
}
 +
.memberName{
 +
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
 +
font-size: 1.5vw;
 +
margin: 1vw 0 1vw 0;
 +
}
 +
.memberDes{
 +
font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
 +
font-size: 1vw;
 +
color: rgba(124,124,124,1);
 +
margin: 1vw 0 1vw 0;
 +
}
 +
</style>
 +
 +
 +
 +
<div class="videoOutDiv">
 +
<div class="videoDiv" data-paralasic="0.45">
 +
</div>
 +
<div class="videoTitle">Watch Team Video</div>
 +
<div class="videoCont">Because I could not stop for death, he kindly stopped for me. The carriage held but just ourselves and immortality.</div>
 +
<div class="videoPlayI"><i class="fa fa-play"></i></div>
 +
</div>
 +
<div class="teamVideo">
 +
<video id="example_video_1" controls controlsList="nodownload" preload="auto">
 +
    <source src="https://static.igem.org/mediawiki/2018/d/d1/T--Fudan-CHINA--teamIntro.mp4" type="video/mp4" />
 +
</video>
 +
<div class="closeVideo">
 +
<i class="fa fa-close"></i>
 +
</div>
 +
</div>
 +
 +
<style>
 +
video::-webkit-media-controls-panel{
 +
background: rgba(35,35,35,0.8);
 +
 +
}
 +
video::-webkit-media-controls-play-button,video::-webkit-media-controls-mute-button,video::-webkit-media-controls-fullscreen-button{
 +
filter: brightness(2);
 +
}
 +
video::-webkit-media-controls-current-time-display{
 +
color: rgba(255,255,255,0.6);
 +
}
 +
video::-webkit-media-controls-time-remaining-display{
 +
color: rgba(255,255,255,0.6);
 +
}
 +
#example_video_1{
 +
display: inline-block;
 +
position: relative;
 +
top:50%;
 +
transform: translateY(-50%);
 +
}
 +
.teamVideo{
 +
position: fixed;
 +
width: 100%;
 +
height: 100%;
 +
background-color: rgba(0,0,0,1);
 +
top: 0;
 +
left: 0;
 +
z-index: 900;
 +
text-align: center;
 +
display: none;
 +
}
 +
.videoDiv{
 +
width:100%;
 +
height:28vw;
 +
background-image: url('image/videoImg.jpg');
 +
background-position: center top;
 +
background-repeat: no-repeat;
 +
background-size: 100%;
 +
text-align: center;
 +
filter: brightness(0.5);
 +
}
 +
.videoTitle{
 +
color: white;
 +
font-size:3vw;
 +
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
 +
text-align:center;
 +
position: relative;
 +
top:-19vw;
 +
font-weight: 900;
 +
}
 +
.videoCont{
 +
color: white;
 +
font-size:1.2vw;
 +
font-family:;
 +
text-align:center;
 +
position: relative;
 +
top:-17vw;
 +
font-weight: 100;
 +
}
 +
.videoOutDiv{
 +
position: relative;
 +
text-align: center;
 +
margin: 5vw 0;
 +
}
 +
.videoPlayI{
 +
position: relative;
 +
top:-13vw;
 +
}
 +
.videoPlayI i{
 +
font-size:2.7vw;
 +
color: white;
 +
border: 2px solid white;
 +
width: 3vw;
 +
height: 3vw;
 +
padding: 1.3vw 0.9vw 0.9vw 1.3vw;
 +
border-radius: 50%;
 +
cursor: pointer;
 +
}
 +
 +
.closeVideo{
 +
position: fixed;
 +
top:2vw;
 +
right: 2vw;
 +
color:rgba(211,211,211,0.8);
 +
font-size: 2.5vw;
 +
cursor: pointer;
 +
transition: all 0.3s ease;
 +
}
 +
.closeVideo:hover{
 +
color: rgba(211,211,211,1);
 +
}
 +
</style>
 +
<script>
 +
$(".videoPlayI i").mouseenter(function(){
 +
$(this).stop().animate({"color":"rgba(135,206,250)","borderColor":"rgba(135,206,250)"},200);
 +
})
 +
$(".videoPlayI i").mouseleave(function(){
 +
$(this).stop().animate({"color":"white","borderColor":"white"},200);
 +
})
 +
 +
videoSizeAdj();
 +
$(window).resize(function(){
 +
videoSizeAdj();
 +
});
 +
 +
function videoSizeAdj(){
 +
var winHeight=$(window).height();
 +
var winWidth=$(window).width();
 +
if (winWidth/winHeight>16/9){
 +
$("#example_video_1").width(winHeight/9*16);
 +
$("#example_video_1").height(winHeight);
 +
}
 +
else{
 +
$("#example_video_1").width(winWidth);
 +
$("#example_video_1").height(winWidth/16*9);
 +
}
 +
}
 +
$(".videoPlayI i").click(function(){
 +
$(".teamVideo").fadeIn();
 +
$("#top_menu_14").fadeOut();
 +
$("#example_video_1")[0].play();
 +
})
 +
$(".closeVideo").click(function(){
 +
$("#top_menu_14").fadeIn();
 +
$(".teamVideo").fadeOut();
 +
$("#example_video_1")[0].pause();
 +
});
 +
 +
 +
$(window).scroll(function() {
 +
var scrollTop = $(window).scrollTop();
 +
var videoDivTop=$(".videoDiv").offset().top;
 +
var winHeight=$(window).height();
 +
var videoDivValue = $('.videoDiv').attr('data-paralasic');
 +
if (scrollTop+winHeight-videoDivTop>0){
 +
$('.videoDiv').css('background-position', 'center top -' + (scrollTop+winHeight-videoDivTop)*videoDivValue + 'px');
 +
}
 +
});
 +
</script>
 +
 +
 +
 +
 +
 +
 +
 +
<div class="members" style="margin-top: -8vw;margin-bottom: 5vw">
 +
<div class="memberTitle theDivTitle">
 +
INSTRUCTORS
 +
</div>
 +
<div class="memberPhoto">
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:1vw;" class="memImg isor" src="https://static.igem.org/mediawiki/2018/f/f2/T--Fudan-CHINA--huang.jpg">
 +
</div>
 +
<div class="memberName">Qiang Huang</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:1.2vw;" class="memImg isor" src="https://static.igem.org/mediawiki/2018/9/9b/T--Fudan-CHINA--mo1.jpg">
 +
</div>
 +
<div class="memberName">Wei Mo</div>
 +
</div>
 +
<div class="everyMem">
 +
<div class="memImgDiv">
 +
<img style="position: relative;top:1vw;" class="memImg isor" src="https://static.igem.org/mediawiki/2018/9/9a/T--Fudan-CHINA--wu.jpg">
 +
</div>
 +
<div class="memberName">Jiaxue Wu</div>
 +
</div>
 +
</div>
 +
</div>
 +
 +
 +
 +
 +
 +
 +
 +
<div class="div1_1">
 +
<div class="paraFilter"></div>
 +
<div id="rightBut"><i class="fa fa-angle-right"></i></div>
 +
<div id="leftBut"><i class="fa fa-angle-left"></i></div>
 +
<div id="memSay">What Our Members Say</div>
 +
<div class="paraDiv1" style="width: 64vw; height: 20vw; overflow:hidden; margin: 0 auto;position: relative;top:9.5vw;">
 +
<div class="carousel" data-num="1">
 +
<img src="https://static.igem.org/mediawiki/2018/9/9c/T--Fudan-CHINA--JKF.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
If you have a workaholic colleague, then you will have a lot less things. If you have a workaholic team leader, then you will be squeezed to work day and night with him. I am sorry, sincerely. 
 +
<div style="text-align: right;">—Kaifeng Jin</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="2">
 +
<img src="https://static.igem.org/mediawiki/2018/6/67/T--Fudan-CHINA--ZZX1234.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
Like the competition, the experiments and all the work I've done. But what amazes me the most is the fact that my love for biology and laboratory is always here in my heart.
 +
<div style="text-align: right;">—Zixuan Zhang</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="3">
 +
<img src="https://static.igem.org/mediawiki/2018/5/5c/T--Fudan-CHINA--DLJ.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
I love molecular cloning, but it doesn’t.
 +
<div style="text-align: right;">—Leijie Dai</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="4">
 +
<img src="https://static.igem.org/mediawiki/2018/e/e7/T--Fudan-CHINA--WSH.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
I’m on the way now. Coming sooooon!!!
 +
<div style="text-align: right;">—Sihan Wang</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="5">
 +
<img src="https://static.igem.org/mediawiki/2018/d/d0/T--Fudan-CHINA--WXX.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
Tea with milk, triple sugar, plus red bean.
 +
<div style="text-align: right;">—Xin Wang</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="6">
 +
<img src="https://static.igem.org/mediawiki/2018/7/7e/T--Fudan-CHINA--ZYN.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont" style="position: relative;top:-7vw;">
 +
Believe it or not - it’s my third time participating in iGEM competition! I took part in iGEM twice in ‘14 and ‘15 back in high school years and it was my experience with iGEM that brought me into majoring in biology in university. This year, I am a wet lab squad member for Team Fudan-CHINA mainly responsible for molecular cloning of our STEP system and protein expression. I hope we can all enjoy beautiful world of life science :)
 +
<div style="text-align: right;">—Yineng Zhou</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="7">
 +
<img src="https://static.igem.org/mediawiki/2018/f/f9/T--Fudan-CHINA--HCC.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
A word of my iGEM is 'HProtein' :P Unforgettable experience. Contacting experts of different fields. Every-day struggle with E.coli and protein. Lovely team members. Bubble milktea every night. Many thanks for Leslie's support.
 +
<div style="text-align: right;">—Haichen Hu</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="8">
 +
<img src="https://static.igem.org/mediawiki/2018/8/86/T--Fudan-CHINA--WY.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
I go wherever team needs me. And I also made two short videos on the wiki. Love photography and film editing. But hate Adobe every time it crashes. Planning to make a vlog about Boston. Please subscribe my youtube channel to watch more!
 +
<div style="text-align: right;">—Yi Wang</div>
 +
</div>
 +
</div>
 +
<div class="carousel" data-num="9">
 +
<img src="https://static.igem.org/mediawiki/2018/b/b1/T--Fudan-CHINA--WYFFF.jpg"><br>
 +
<i class="fa fa-quote-left"></i>
 +
<div class="memCont">
 +
Pymol is the most beautiful thing all over the world.
 +
<div style="text-align: right;">—Yifan Wang</div>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="memDotDiv">
 +
<div class="memDot" data-dotNum="1"></div>
 +
<div class="memDot" data-dotNum="2"></div>
 +
<div class="memDot" data-dotNum="3"></div>
 +
<div class="memDot" data-dotNum="4"></div>
 +
<div class="memDot" data-dotNum="5"></div>
 +
<div class="memDot" data-dotNum="6"></div>
 +
<div class="memDot" data-dotNum="7"></div>
 +
<div class="memDot" data-dotNum="8"></div>
 +
<div class="memDot" data-dotNum="9"></div>
 +
</div>
 +
</div>
 +
<style>
 +
.carousel{
 +
width: 100%;
 +
padding: 0;
 +
margin: 0;
 +
color: white;
 +
font-size: 1vw;
 +
position: absolute;
 +
top:0;
 +
left: 0;
 +
display: none;
 +
z-index:2;
 +
}
 +
.carousel:before{
 +
content: "";
 +
height: 10vw;
 +
width: 0.05vw;
 +
background-color: white;
 +
position: absolute;
 +
left: 13vw;
 +
top:2.8vw;
 +
}
 +
.carousel i{
 +
font-size: 3vw;
 +
padding: 2vw 0 0 3.8vw ;
 +
}
 +
.carousel img{
 +
width: 10vw;
 +
border-radius: 50%;
 +
}
 +
.memCont{
 +
position: absolute;
 +
width: 46vw;
 +
left: 16vw;
 +
top:50%;
 +
transform: translateY(-70%);
 +
font-size: 1.4vw;
 +
font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
 +
line-height: 2vw;
 +
}
 +
#rightBut,#leftBut{
 +
font-size: 1.3vw;
 +
color: rgba(225,225,225,1);
 +
border: 0.2vw solid rgba(235,235,235,1);
 +
display: inline-block;
 +
width: 2.6vw;
 +
height: 2.6vw;
 +
padding: 0;
 +
margin: 0;
 +
text-align: center;
 +
line-height: 2.6vw;
 +
position: absolute;
 +
z-index: 3;
 +
top:5vw;
 +
cursor:pointer;
 +
}
 +
#rightBut{
 +
right:20vw;
 +
}
 +
#leftBut{
 +
right:24vw;
 +
}
 +
#memSay{
 +
font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
 +
font-size: 2.5vw;
 +
font-weight: 900;
 +
color: white;
 +
position: absolute;
 +
top:5.3vw;
 +
left: 30vw;
 +
z-index: 2;
 +
}
 +
.memDotDiv{
 +
position: absolute;
 +
top:27vw;
 +
left:50%;
 +
transform: translateX(-50%);
 +
z-index: 2;
 +
}
 +
.memDot{
 +
width: 0.65vw;
 +
height: 0.65vw;
 +
background: rgba(214,222,229,1);
 +
border-radius: 50%;
 +
display: inline-block;
 +
margin: 0 0.3vw;
 +
cursor:pointer;
 +
}
 +
.div1_1{
 +
height:29vw;
 +
position: relative;
 +
font-size: 0;
 +
margin: 2vw 0 0 0;
 +
}
 +
 +
.paraFilter{
 +
background:url(image/bgimg1.jpg);
 +
        background-size: 100%;
 +
        background-position:center center;
 +
        background-repeat: no-repeat;
 +
position: absolute;
 +
z-index: 1;
 +
top:0;
 +
left:0;
 +
width: 100%;
 +
height: 100%;
 +
filter: brightness(0.4);
 +
}
 +
</style>
 +
<script>
 +
    var actNum=1;
 +
    var ani=1;
 +
    var memDotDivNum=$(".memDotDiv").children().length;
 +
    $("[data-num=1]").show();
 +
$("[data-dotNum='"+actNum+"']").css("backgroundColor","rgba(106,140,183,1)");
 +
 +
$("#rightBut").click(function(){
 +
var caraWidth=$(".carousel").width();
 +
if($("[data-num='"+ani+"']").is(":animated")){
 +
$("[data-num='"+ani+"']").stop(false,true);
 +
}
 +
if($("[data-num='"+actNum+"']").is(":animated")){
 +
$("[data-num='"+actNum+"']").stop(false,true);
 +
}
 +
ani=actNum;
 +
actNum=actNum%memDotDivNum+1;
 +
$("[data-dotNum='"+actNum+"']").css("backgroundColor","rgba(106,140,183,1)");
 +
$(".memDotDiv [data-dotNum!='"+actNum+"']").css("backgroundColor","rgba(214,222,229,1)");
 +
$("[data-num='"+actNum+"']").show();
 +
$("[data-num='"+actNum+"']").css("left",caraWidth);
 +
$("[data-num='"+actNum+"']").animate({left:"0"});
 +
$("[data-num='"+ani+"']").animate({left:-caraWidth});
 +
 +
});
 +
$("#leftBut").click(function(){
 +
var caraWidth=$(".carousel").width();
 +
if($("[data-num='"+ani+"']").is(":animated")){
 +
$("[data-num='"+ani+"']").stop(false,true);
 +
}
 +
if($("[data-num='"+actNum+"']").is(":animated")){
 +
$("[data-num='"+actNum+"']").stop(false,true);
 +
}
 +
ani=actNum;
 +
actNum=memDotDivNum-(memDotDivNum+1-actNum)%memDotDivNum;
 +
$("[data-dotNum='"+actNum+"']").css("backgroundColor","rgba(106,140,183,1)");
 +
$(".memDotDiv [data-dotNum!='"+actNum+"']").css("backgroundColor","rgba(214,222,229,1)");
 +
 +
$("[data-num='"+actNum+"']").show();
 +
$("[data-num='"+actNum+"']").css("left",-caraWidth);
 +
$("[data-num='"+actNum+"']").animate({left:"0"});
 +
$("[data-num='"+ani+"']").animate({left:caraWidth});
 +
});
 +
 +
$(".memDot").mouseenter(function(){
 +
var caraWidth=$(".carousel").width();
 +
    if($("[data-num='"+ani+"']").is(":animated")){
 +
$("[data-num='"+ani+"']").stop(false,true);
 +
}
 +
if($("[data-num='"+actNum+"']").is(":animated")){
 +
$("[data-num='"+actNum+"']").stop(false,true);
 +
}
 +
ani=actNum;
 +
actNum=$(this).attr("data-dotNum");
 +
$("[data-dotNum='"+actNum+"']").css("backgroundColor","rgba(106,140,183,1)");
 +
$(".memDotDiv [data-dotNum!='"+actNum+"']").css("backgroundColor","rgba(214,222,229,1)");
 +
if(ani<actNum){
 +
$("[data-num='"+actNum+"']").show();
 +
$("[data-num='"+actNum+"']").css("left",caraWidth);
 +
$("[data-num='"+actNum+"']").animate({left:"0"});
 +
$("[data-num='"+ani+"']").animate({left:-caraWidth});
 +
}
 +
else if(ani>actNum){
 +
$("[data-num='"+actNum+"']").show();
 +
$("[data-num='"+actNum+"']").css("left",-caraWidth);
 +
$("[data-num='"+actNum+"']").animate({left:"0"});
 +
$("[data-num='"+ani+"']").animate({left:caraWidth});
 +
}
 +
});
 +
</script>
 +
<!---------------------------------------------------------------------------------------------------------------------------------------------------->
 +
 +
<!--TEMPLATE:contact-->
 +
 +
<div id="contactUs">
 +
<img width="8%">
 +
<div class="cuCol" id="cuCol1" style="width: 17%;">
 +
<h1 class="cuH1"><i class="fa fa-link"></i>&nbsp;&nbsp;Useful Links</h1>
 +
<hr width="50%">
 +
<br/>
 +
        <div class="cuContent">
 +
<a target="_blank" href="https://2018.igem.org/Main_Page"><i class="fa fa-caret-right"></i>&nbsp;iGEM Main Page</a>
 +
<br/>
 +
<a target="_blank" href="https://2018.igem.org/Main_Page"><i class="fa fa-caret-right"></i>&nbsp;iGEM Special Pages</a>
 +
</div>
 +
</div>
 +
<img width="5%">
 +
<div class="cuCol" id="cuCol2" style="width: 17%;">
 +
<h1 class="cuH1"><i class="fa fa-envelope-o"></i>&nbsp;&nbsp;Email</h1>
 +
<hr width="50%">
 +
<br/>
 +
<div  class="cuContent">
 +
<a href="mailto:igem@fudan.edu.cn"><i class="fa fa-caret-right"></i>&nbsp;igem@fudan.edu.cn</a>
 +
<br/>
 +
<a href="mailto:kfjin16@fudan.edu.cn"><i class="fa fa-caret-right"></i>&nbsp;kfjin16@fudan.edu.cn</a>
 +
 +
<br/>
 +
</div>
 +
</div>
 +
<img width="5%">
 +
<div class="cuCol" id="cuCol3" style="width: 30%;">
 +
<h1 class="cuH1"><i class="fa fa-paper-plane"></i>&nbsp;&nbsp;Address</h1>
 +
<hr width="50%">
 +
<br/>
 +
<div  class="cuContent">
 +
G604, School of Life Sciences, Fudan University<br/>
 +
2005 Songhu Road, Yangpu, Shanghai, China
 +
</div>
 +
</div>
 +
<img id="cuTeamImg" src="https://static.igem.org/mediawiki/2018/f/fc/T--Fudan-CHINA--teamBadgeWhite.png"/>
 +
</div>
 +
 +
<style>
 +
#contactUs{
 +
width: 100%;
 +
background: rgba(25,25,25,1);
 +
overflow: hidden;
 +
margin: 0;
 +
padding:1.5% 0 3% 0;
 +
text-align: left;
 +
position: relative;
 +
z-index: 1;
 +
}
 +
.cuCol{
 +
      display: inline-block;
 +
position: relative;
 +
left:20px;
 +
opacity: 0;
 +
color: rgba(168,168,168,1.00);
 +
text-align: left;
 +
vertical-align: top;
 +
}
 +
h1.cuH1{
 +
color: white;
 +
font-size: 1.4vw;
 +
font-style: normal;
 +
}
 +
.cuContent{
 +
font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
 +
font-size: 1.25vw;
 +
line-height: 1.6vw;
 +
}
 +
#contactUs a{
 +
color: rgba(168,168,168,1.00);
 +
text-decoration: none;
 +
}
 +
#contactUs a:hover{
 +
text-decoration: none;
 +
color:rgba(0,189,234,1);
 +
}
 +
#contactUs a:visited{
 +
text-decoration: none;
 +
}
 +
#contactUs a:active{
 +
text-decoration: none;
 +
}
 +
#contactUs br{
 +
line-height: 1vw;
 +
}
 +
#cuTeamImg{
 +
position: absolute;
 +
top:1vw;
 +
right:4vw;
 +
width: 10vw;
 +
opacity: 0.2;
 +
}
 +
</style>
 +
<script>
 +
slideInLeft($("#cuCol1"),$("#contactUs"),0);
 +
slideInLeft($("#cuCol2"),$("#contactUs"),150);
 +
slideInLeft($("#cuCol3"),$("#contactUs"),300);
 +
$(window).scroll(function(){
 +
slideInLeft($("#cuCol1"),$("#contactUs"),0);
 +
slideInLeft($("#cuCol2"),$("#contactUs"),150);
 +
slideInLeft($("#cuCol3"),$("#contactUs"),300);
 +
});
 +
 +
 +
</script>
 +
 +
<p>
 +
 +
<!--end--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 +
 +
  
 
</html>
 
</html>

Revision as of 21:21, 17 October 2018

Team
"All human wisdom is summed up in two words, wait and hope."
MEMBERS
Kaifeng Jin
Zixuan Zhang
Leijie Dai
Sihan Wang
Xin Wang

Yineng Zhou
Haichen Hu
Yi Wang
Yifan Wang
Watch Team Video
Because I could not stop for death, he kindly stopped for me. The carriage held but just ourselves and immortality.
INSTRUCTORS
Qiang Huang
Wei Mo
Jiaxue Wu
What Our Members Say

If you have a workaholic colleague, then you will have a lot less things. If you have a workaholic team leader, then you will be squeezed to work day and night with him. I am sorry, sincerely.
—Kaifeng Jin

Like the competition, the experiments and all the work I've done. But what amazes me the most is the fact that my love for biology and laboratory is always here in my heart.
—Zixuan Zhang

I love molecular cloning, but it doesn’t.
—Leijie Dai

I’m on the way now. Coming sooooon!!!
—Sihan Wang

Tea with milk, triple sugar, plus red bean.
—Xin Wang

Believe it or not - it’s my third time participating in iGEM competition! I took part in iGEM twice in ‘14 and ‘15 back in high school years and it was my experience with iGEM that brought me into majoring in biology in university. This year, I am a wet lab squad member for Team Fudan-CHINA mainly responsible for molecular cloning of our STEP system and protein expression. I hope we can all enjoy beautiful world of life science :)
—Yineng Zhou

A word of my iGEM is 'HProtein' :P Unforgettable experience. Contacting experts of different fields. Every-day struggle with E.coli and protein. Lovely team members. Bubble milktea every night. Many thanks for Leslie's support.
—Haichen Hu

I go wherever team needs me. And I also made two short videos on the wiki. Love photography and film editing. But hate Adobe every time it crashes. Planning to make a vlog about Boston. Please subscribe my youtube channel to watch more!
—Yi Wang

Pymol is the most beautiful thing all over the world.
—Yifan Wang

  Address


G604, School of Life Sciences, Fudan University
2005 Songhu Road, Yangpu, Shanghai, China