Team:ZJU-China

From 2012.igem.org

(Difference between revisions)
 
(15 intermediate revisions not shown)
Line 1: Line 1:
<html xmlns="http://www.w3.org/1999/xhtml" class="cufon-active cufon-ready"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<html xmlns="http://www.w3.org/1999/xhtml" class="cufon-active cufon-ready"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-
<meta name="generator" content="jemdoc, see http://jemdoc.jaboc.net/">
+
<title>HOME</title>
-
 
+
-
<link rel="stylesheet" href="http://www.jiajunlu.com/Jiajun Lu_files/jemdoc.css" type="text/css">
+
-
 
+
-
<title>ABOUT US</title>
+
<meta name="description" content="">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="keywords" content="">
<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="">
<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="">
 +
<link href="http://www.jiajunlu.com/igem/style.css" rel="stylesheet" type="text/css">
<link href="http://www.jiajunlu.com/igem/style.css" rel="stylesheet" type="text/css">
 +
<link rel="stylesheet" href="http://www.jiajunlu.com/igem/slide.css" type="text/css" media="screen">
 +
<style type="text/css">
<style type="text/css">
Line 80: Line 79:
#content a:hover
#content a:hover
{
{
-
   color: black;
+
   color: #FF8000;
   display: inline;
   display: inline;
}
}
Line 118: Line 117:
p
p
{
{
-
   font-family: Arial, sans-serif;
+
   font-family: Century Gothic, sans-serif;
-
   color: black;
+
   color: grey;
 +
  font-size: 18px;
   margin: 0;
   margin: 0;
   padding: 0;
   padding: 0;
Line 183: Line 183:
   clear: both;
   clear: both;
   overflow: hidden;
   overflow: hidden;
 +
}
 +
 +
#search-controls
 +
{
 +
  display: none
 +
}
 +
#footer-box
 +
{
 +
  display: none;
}
}
</style>
</style>
 +
 +
<script src="http://www.jiajunlu.com/igem/cufon-yui.js" type="text/javascript"></script><style type="text/css">cufon{text-indent:0!important;}@media screen,projection{cufon{display:inline!important;display:inline-block!important;position:relative!important;vertical-align:middle!important;font-size:1px!important;line-height:1px!important;}cufon cufontext{display:-moz-inline-box!important;display:inline-block!important;width:0!important;height:0!important;overflow:hidden!important;text-indent:-10000in!important;}cufon canvas{position:relative!important;}}@media print{cufon{padding:0!important;}cufon canvas{display:none!important;}}</style>
<script src="http://www.jiajunlu.com/igem/cufon-yui.js" type="text/javascript"></script><style type="text/css">cufon{text-indent:0!important;}@media screen,projection{cufon{display:inline!important;display:inline-block!important;position:relative!important;vertical-align:middle!important;font-size:1px!important;line-height:1px!important;}cufon cufontext{display:-moz-inline-box!important;display:inline-block!important;width:0!important;height:0!important;overflow:hidden!important;text-indent:-10000in!important;}cufon canvas{position:relative!important;}}@media print{cufon{padding:0!important;}cufon canvas{display:none!important;}}</style>
<script src="http://www.jiajunlu.com/igem/gotham.js" type="text/javascript"></script>
<script src="http://www.jiajunlu.com/igem/gotham.js" type="text/javascript"></script>
<script type="text/javascript">
<script type="text/javascript">
-
Cufon.replace('h3');
+
Cufon.replace('h1,h2,h3,h5');
-
+
-
+
</script>
</script>
-
<link rel="stylesheet" href="http://www.jiajunlu.com/igem/slide.css" type="text/css" media="screen">
 
-
<link rel="stylesheet" href="http://www.jiajunlu.com/igem/accordion.css" type="text/css" media="screen">
 
-
<script type="text/javascript" src="http://www.jiajunlu.com/igem/jquery.min.js"></script>
 
-
<script type="text/javascript">
 
-
$(document).ready(function(){
 
-
 
-
//Hide (Collapse) the toggle containers on load
 
-
$(".acc_container").hide();
 
-
//Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state)
 
-
$("h2.acc_trigger").click(function(){
 
-
$(this).toggleClass("active").next().slideToggle("slow");
 
-
 
-
return false; //Prevent the browser jump to the link anchor
 
-
});
 
-
 
-
});
 
-
</script>
 
-
 
-
 
-
 
-
<style type="text/css" media="all">
 
-
.d1{width:830px;height:auto;overflow:hidden;border:#666666 2px solid;background-color:#000000;position:relative;}
 
-
.loading{width:830px;border:#666666 2px solid;background-color:#000000;color:#FFCC00;font-size:12px;height:550px;text-align:center;padding-top:30px;font-family:Verdana, Arial, Helvetica, sans-serif;font-weight:bold;}
 
-
.d2{width:100%;height:600px;overflow:hidden;}
 
-
.num_list{position:absolute;width:100%;left:0px;bottom:-1px;background-color:#000000;color:#FFFFFF;font-size:12px;padding:4px 0px;height:20px;overflow:hidden;}
 
-
.num_list span{display:inline-block;height:16px;padding-left:6px;}
 
-
img{border:0px;}
 
-
.button{position:absolute; z-index:1000; right:0px; bottom:2px; font-size:13px; font-weight:bold; font-family:Arial, Helvetica, sans-serif;}
 
-
.b1,.b2{background-color:#666666;display:block;float:left;padding:2px 6px;margin-right:3px;color:#FFFFFF;text-decoration:none;cursor:pointer;}
 
-
.b2{color:#FFCC33;background-color:#FF6633;}
 
-
ul{display:none;}
 
-
</style>
 
-
 
-
<script language="javascript" type="text/javascript">
 
-
//主函数
 
-
var s1=function(){
 
-
var interv=2000; //切换间隔时间
 
-
var interv2=10; //切换速速
 
-
var opac1=80; //文字背景的透明度
 
-
var source="fade_focus1" //焦点轮换图片容器的id名称
 
-
//获取对象
 
-
function getTag(tag,obj){if(obj==null){return document.getElementsByTagName(tag)}else{return obj.getElementsByTagName(tag)}}
 
-
function getid(id){return document.getElementById(id)};
 
-
var opac=0,j=0,t=63,num,scton=0,timer,timer2,timer3;var id=getid(source);id.removeChild(getTag("div",id)[0]);var li=getTag("li",id);var div=document.createElement("div");var title=document.createElement("div");var span=document.createElement("span");var button=document.createElement("div");button.className="button";for(var i=0;i<li.length;i++){var a=document.createElement("a");a.innerHTML=i+1;a.onclick=function(){clearTimeout(timer);clearTimeout(timer2);clearTimeout(timer3);j=parseInt(this.innerHTML)-1;scton=0;t=63;opac=0;fadeon();};a.className="b1";a.onmouseover=function(){this.className="b2"};a.onmouseout=function(){this.className="b1";sc(j)};button.appendChild(a);}
 
-
//控制图层透明度
 
-
function alpha(obj,n){if(document.all){obj.style.filter="alpha(opacity="+n+")";}else{obj.style.opacity=(n/100);}}
 
-
//控制焦点按钮
 
-
function sc(n){for(var i=0;i<li.length;i++){button.childNodes[i].className="b1"};button.childNodes[n].className="b2";}
 
-
title.className="num_list";title.appendChild(span);alpha(title,opac1);id.className="d1";div.className="d2";id.appendChild(div);id.appendChild(title);id.appendChild(button);
 
-
//渐显
 
-
var fadeon=function(){opac+=5;div.innerHTML=li[j].innerHTML;span.innerHTML=getTag("img",li[j])[0].alt;alpha(div,opac);if(scton==0){sc(j);num=-2;scrolltxt();scton=1};if(opac<100){timer=setTimeout(fadeon,interv2)}else{timer2=setTimeout(fadeout,interv);};}
 
-
//渐隐
 
-
var fadeout=function(){opac-=5;div.innerHTML=li[j].innerHTML;alpha(div,opac);if(scton==0){num=2;scrolltxt();scton=1};if(opac>0){timer=setTimeout(fadeout,interv2)}else{if(j<li.length-1){j++}else{j=0};fadeon()};}
 
-
//滚动文字
 
-
var scrolltxt=function(){t+=num;span.style.marginTop=t+"px";if(num<0&&t>3){timer3=setTimeout(scrolltxt,interv2)}else if(num>0&&t<62){timer3=setTimeout(scrolltxt,interv2)}else{scton=0}};
 
-
fadeon();
 
-
}
 
-
//初始化
 
-
window.onload=function(){
 
-
s1();
 
-
};
 
-
</script>
 
-
 
-
 
 +
<script type="text/javascript" src="http://www.jiajunlu.com/igem/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://www.jiajunlu.com/igem/my.js"></script>
<script type="text/javascript" src="http://www.jiajunlu.com/igem/my.js"></script>
<script src="http://www.jiajunlu.com/igem/slide.js" type="text/javascript"></script>
<script src="http://www.jiajunlu.com/igem/slide.js" type="text/javascript"></script>
 +
<script type="text/javascript" src="http://www.jiajunlu.com/igem/validation_login.js"></script>
 +
<script type="text/javascript">
<script type="text/javascript">
 +
function movetotop(){
function movetotop(){
     $("html, body").animate({ scrollTop: 0 }, "slow");
     $("html, body").animate({ scrollTop: 0 }, "slow");
     return false;
     return false;
}
}
 +
         $(function() {
         $(function() {
             var offset = $("#logo").offset();
             var offset = $("#logo").offset();
Line 281: Line 231:
         });
         });
     </script>
     </script>
-
   
 
</head>
</head>
-
<body class="work">
+
<body class="home">
<div class="wrapper">
<div class="wrapper">
Line 290: Line 239:
    <div class="content">
    <div class="content">
    <div id="columnLeft">
    <div id="columnLeft">
-
    <div id="logo" style="margin-top: 0px; " onclick="movetotop()">
+
    <div id="logo" style="margin-top: 0px; " onclick="movetotop()">
-
        <a><img src="https://static.igem.org/mediawiki/2012/1/12/Zju_logo.png"></a>
+
        <a><img src="https://static.igem.org/mediawiki/2012/1/12/Zju_logo.png" width="80%"></a>
    <!-- end #logo --></div>
    <!-- end #logo --></div>
        <!-- end #columnLeft" --></div>
        <!-- end #columnLeft" --></div>
 +
        <div id="columnRight">
        <div id="columnRight">
 +
        <div id="header">
        <div id="header">
            <div id="menu">
            <div id="menu">
Line 321: Line 272:
            <div id="main">
            <div id="main">
-
 
+
        <div id="mainLeft">
-
<h2 class="acc_trigger"><a href="">01 <strong>ABOUT ZJU</strong></a></h2>
+
            <img src="https://static.igem.org/mediawiki/igem.org/1/13/Zju_WeGoodtxt.jpg" width="120%">
-
<div class="acc_container" style="display: none; ">
+
            <div class="text">
-
 
+
            <h5><cufon class="cufon cufon-canvas" alt="WEB " style="width: 35px; height: 12px; "><canvas width="47" height="16" style="width: 47px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>WEB </cufontext></cufon><cufon class="cufon cufon-canvas" alt="+ " style="width: 12px; height: 12px; "><canvas width="24" height="16" style="width: 24px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>+ </cufontext></cufon><cufon class="cufon cufon-canvas" alt="INTERACTIVE " style="width: 90px; height: 12px; "><canvas width="102" height="16" style="width: 102px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>INTERACTIVE </cufontext></cufon><cufon class="cufon cufon-canvas" alt="+ " style="width: 12px; height: 12px; "><canvas width="24" height="16" style="width: 24px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>+ </cufontext></cufon><cufon class="cufon cufon-canvas" alt="BRANDING " style="width: 74px; height: 12px; "><canvas width="86" height="16" style="width: 86px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>BRANDING </cufontext></cufon><cufon class="cufon cufon-canvas" alt="+ " style="width: 12px; height: 12px; "><canvas width="24" height="16" style="width: 24px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>+ </cufontext></cufon><cufon class="cufon cufon-canvas" alt="PRINT " style="width: 43px; height: 12px; "><canvas width="55" height="16" style="width: 55px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>PRINT </cufontext></cufon><cufon class="cufon cufon-canvas" alt="+ " style="width: 12px; height: 12px; "><canvas width="24" height="16" style="width: 24px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>+ </cufontext></cufon><cufon class="cufon cufon-canvas" alt="SIGNAGE. " style="width: 66px; height: 12px; "><canvas width="78" height="16" style="width: 78px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>SIGNAGE. </cufontext></cufon><cufon class="cufon cufon-canvas" alt="IT&#39;S " style="width: 27px; height: 12px; "><canvas width="39" height="16" style="width: 39px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>IT'S </cufontext></cufon><cufon class="cufon cufon-canvas" alt="WHAT " style="width: 45px; height: 12px; "><canvas width="57" height="16" style="width: 57px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>WHAT </cufontext></cufon><cufon class="cufon cufon-canvas" alt="WE " style="width: 26px; height: 12px; "><canvas width="38" height="16" style="width: 38px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>WE </cufontext></cufon><cufon class="cufon cufon-canvas" alt="LOVE " style="width: 38px; height: 12px; "><canvas width="50" height="16" style="width: 50px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>LOVE </cufontext></cufon><cufon class="cufon cufon-canvas" alt="TO " style="width: 22px; height: 12px; "><canvas width="34" height="16" style="width: 34px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>TO </cufontext></cufon><cufon class="cufon cufon-canvas" alt="DO. " style="width: 27px; height: 12px; "><canvas width="39" height="16" style="width: 39px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>DO. </cufontext></cufon><cufon class="cufon cufon-canvas" alt="SO " style="width: 22px; height: 12px; "><canvas width="34" height="16" style="width: 34px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>SO </cufontext></cufon><cufon class="cufon cufon-canvas" alt="RELAX, " style="width: 51px; height: 12px; "><canvas width="63" height="16" style="width: 63px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>RELAX, </cufontext></cufon><cufon class="cufon cufon-canvas" alt="WE&#39;VE " style="width: 47px; height: 12px; "><canvas width="59" height="16" style="width: 59px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>WE'VE </cufontext></cufon><cufon class="cufon cufon-canvas" alt="GOT " style="width: 32px; height: 12px; "><canvas width="44" height="16" style="width: 44px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>GOT </cufontext></cufon><cufon class="cufon cufon-canvas" alt="THIS." style="width: 33px; height: 12px; "><canvas width="45" height="16" style="width: 45px; height: 16px; top: -3px; left: -1px; "></canvas><cufontext>THIS.</cufontext></cufon></h5>
-
<!--Content Goes Here-->
+
            <!-- end .text --></div>
-
<p>The University Motto: Seeking the Truth and Pioneering New Trails.</p>
+
        <!-- end #mainLeft --></div>
-
<p>&nbsp;</p>
+
            <div id="mainRight">
-
<p>The history of Zhejiang University goes back to 115 years ago. As a truly comprehensive institution with a full range of disciplines, Zhejiang University covers lots of subjects and aims at providing an outstanding education that will enable its students to build a future of professional, intellectual and personal success, capable of leadership in different areas, whether it be political, economic or academic. </p>
+
            <img src="https://static.igem.org/mediawiki/2012/2/2c/Zju_cloud.png" width="440px" onmouseover="this.src='https://static.igem.org/mediawiki/2012/9/94/Zju_cloudon.gif';" onmouseout="this.src='https://static.igem.org/mediawiki/2012/2/2c/Zju_cloud.png';" />
-
<p>&nbsp;</p>
+
            <!-- end #mainRight --></div>
-
<p>We have five campuses. The names are: Yuquan, Xixi, Huajiachi, Zhijiang, and Zijingang. These names are all "water" related. In English, they mean spring, stream, pool, river, and port. Each campus has its own beauty. Yuquan is charming, Xixi is elegant, Huajiachi is simple, Zhijiang is ancient and Zijingang is modern.
+
<div class="floatC">
-
For more information, click http://www.zju.edu.cn</p>
+
<p>Watch the <a href="https://2012.igem.org/Team:ZJU-China/video_play.htm" target="_blank">video</a> to get a better understanding of our project!</p>
-
<p>&nbsp;</p>
+
-
<p>Here we want to show you a set of amazing photos shot by Gang Cheng, an alumnus of  Zhejiang University.</p>
+
-
 
+
-
<div id="fade_focus1">
+
-
  <div class="loading">Loading...<br /></div>
+
-
    <ul>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about1.jpg" width="830" height="600" alt="The gate of Yuquan and BG Tree" /></a></li>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about2.jpg" width="830" height="600" alt="Chairman Mao with Gesture Like Calling a Taxi" /></a></li>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about3.jpg" width="830" height="600" alt="One of Libraries" /></a></li>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about4.jpg" width="830" height="600" alt="Lovely President Chu Kochen" /></a></li>
+
-
  <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about5.jpg" width="830" height="600" alt="Lovers' Slope" /></a></li>
+
-
  <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about6.jpg" width="830" height="600" alt="Square of Yongqian" /></a></li>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about7.jpg" width="830" height="600" alt="One of  Teaching Buildings of  Long History" /></a></li>
+
-
      <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about8.jpg" width="830" height="600" alt="The Modern Zijingang" /></a></li>
+
-
  <li><a  target="_blank"><img src="http://www.jiajunlu.com/igem/zju_about8.jpg" width="830" height="600" alt="The Modern Zijingang" /></a></li>
+
-
    </ul>
+
</div>
</div>
-
</div><!-- end .acc_container -->
 
-
 
-
        <h2 class="acc_trigger"><a href="http://thesum.ca/work.html#">02 <strong>TEAM</strong></a></h2>
 
-
<div class="acc_container" style="display: none; ">
 
-
 
-
<!--Content Goes Here-->
 
-
<p>Our team, ZJU-China, consists of 9 undergraduates and 3 advisers. On the lakeside of the beautiful West Lake, we gather together, brainstorming heatedly, doing experiment carefully, thinking about life and future, going out for movie and feast. We love life, also love iGEM. </p>
 
-
 
-
</div><!-- end .acc_container -->
 
-
 
-
<h2 class="acc_trigger"><a href="http://thesum.ca/work.html#">03 <strong>SPONSORS</strong></a></h2>
 
-
<div class="acc_container" style="display: none; ">
 
-
 
-
<!--Content Goes Here-->
 
-
 
-
 
-
</div><!-- end .acc_container -->
 
-
 
-
<h2 class="acc_trigger"><a href="http://thesum.ca/work.html#">04 <strong>ACKNOWLEDGE</strong></a></h2>
 
-
<div class="acc_container" style="display: none; ">
 
-
 
-
<!--Content Goes Here-->
 
-
<p>We can't complete the project without the guidance and support of the people as follows:</p>
 
-
<p>&nbsp;</p>
 
-
<p>1. Ming Ding and Room 413 in Experimental Centre, for use of lab space and material support</p>
 
-
<p>&nbsp;</p>
 
-
<p>2. Xiang Lan, Xin Li, Chao Zong, Mu Xiao, graduate student and vice-professor advisors</p>
 
-
<p>&nbsp;</p>
 
-
<p>3. Prof. Xiaohang Yang in Room 1305, for helpful suggestions and use of Confocal and Fluorescence Microscope</p>
 
-
<p>&nbsp;</p>
 
-
<p>4. Fan Zhang, for patient guidance of how to operate Confocal </p>
 
-
<p>&nbsp;</p>
 
-
<p>5. Prof. Jianzhong Shao, for helpful suggestions and use of ELISA reader</p>
 
-
<p>&nbsp;</p>
 
-
<p>6. Lvyun Zhu, for patient guidance of how to operate ELISA reader</p>
 
-
<p>&nbsp;</p>
 
-
<p>7. Zhejiang University, for financial support</p>
 
-
 
-
</div><!-- end .acc_container -->
 
-
 
-
<h2 class="acc_trigger"><a href="http://thesum.ca/work.html#">05 <strong>CONTACT US</strong></a></h2>
 
-
<div class="acc_container" style="display: none; ">
 
-
 
-
 
-
 
-
</div><!-- end .acc_container -->
 
-
 
            <!-- end #main --></div>
            <!-- end #main --></div>
            <br class="clearfloat">
            <br class="clearfloat">
-
            <br class="clearfloat">
+
 
-
            <br class="clearfloat">
+
-
            <br class="clearfloat">
+
-
           
+
        <!-- end #columnRight --></div>
        <!-- end #columnRight --></div>
-
       
+
 
    <!-- end .content --></div>
    <!-- end .content --></div>
-
 
-
 
<!-- end .container --></div>
<!-- end .container --></div>
-
</div><!-- end .wrapper -->
+
</div><!-- end .wrapper -->
-
  <div><img src="https://static.igem.org/mediawiki/igem.org/d/d9/Zju_foot.png" width="100%"></div>
+
    <div><img src="https://static.igem.org/mediawiki/igem.org/d/d9/Zju_foot.png" width="100%"></div>
<div id="footer">
<div id="footer">
Line 417: Line 300:
     </div><!-- end footerImg -->
     </div><!-- end footerImg -->
-
 
+
<!-- end #footer --></div>
-
 
+
-
<!-- end #footer --></div>
+
<script type="text/javascript"> Cufon.now(); </script>
<script type="text/javascript"> Cufon.now(); </script>
-
 
</body></html>
</body></html>

Latest revision as of 21:09, 26 October 2012

HOME

WEB + INTERACTIVE + BRANDING + PRINT + SIGNAGE. IT'S WHAT WE LOVE TO DO. SO RELAX, WE'VE GOT THIS.

Watch the video to get a better understanding of our project!