Difference between revisions of "Team:WHU-China/Description"

(Prototype team page)
 
Line 1: Line 1:
−
{{WHU-China}}
+
{{WHU-China-Header}}
 
<html>
 
<html>
  
−
<h2> Project Description </h2>
+
<style type="text/css">
−
 
+
body{
−
<p>Tell us about your project, describe what moves you and why this is something important for your team.</p>
+
margin:0;
−
<br />
+
padding:0;
−
 
+
}
−
<h5>What should this page contain?</h5>
+
.container{
−
<ul>
+
position:absolute;
−
<li> A clear and concise description of your project.</li>
+
width:95%;
−
<li>A detailed explanation of why your team chose to work on this particular project.</li>
+
left:5%;
−
<li>References and sources to document your research.</li>
+
height:2000px;
−
<li>Use illustrations and other visual resources to explain your project.</li>
+
z-index:0;
−
</ul>
+
padding:0;
−
 
+
}
−
 
+
.container img{
−
<br />
+
position:absolute;
−
<h4>Advice on writing your Project Description</h4>
+
z-index:0;
−
 
+
}
−
<p>
+
.left{
−
We encourage you to put up a lot of information and content on your wiki, but we also encourage you to include summaries as much as possible. If you think of the sections in your project description as the sections in a publication, you should try to be consist, accurate and unambiguous in your achievements.  
+
position:absolute;
−
</p>
+
left:0;
−
 
+
height:2000px;
−
<p>
+
width:5%;
−
Judges like to read your wiki and know exactly what you have achieved. This is how you should think about these sections; from the point of view of the judge evaluating you at the end of the year.
+
background-image:url(https://static.igem.org/mediawiki/2015/8/8c/WHU-China_left.png);
−
</p>
+
z-index:0;
−
 
+
}
−
 
+
.header{
−
<br />
+
position:absolute;
−
<h4>References</h4>
+
width:100%;
−
<p>iGEM teams are encouraged to record references you use during the course of your research. They should be posted somewhere on your wiki so that judges and other visitors can see how you though about your project and what works inspired you.</p>
+
z-index:1;
−
 
+
padding-top:1%;
−
 
+
}
−
 
+
.header-left{
−
<h4>Inspiration</h4>
+
position:absolute;
−
<p>See how other teams have described and presented their projects: </p>
+
width:40%;
−
 
+
z-index:1;
−
<ul>
+
}
−
<li><a href="https://2014.igem.org/Team:Imperial/Project"> Imperial</a></li>
+
.header-right{
−
<li><a href="https://2014.igem.org/Team:UC_Davis/Project_Overview"> UC Davis</a></li>
+
position:absolute;
−
<li><a href="https://2014.igem.org/Team:SYSU-Software/Overview">SYSU Software</a></li>
+
height:300px;
−
</ul>
+
width:55%;
−
 
+
left:45%;
−
</div>
+
z-index:1;
 +
}
 +
.header-right ul{
 +
padding:0;
 +
position:absolute;
 +
bottom:82%;
 +
list-style:none;
 +
}
 +
.header-right ul nav a{
 +
text-decoration:none;
 +
}
 +
.middle-left{
 +
position:absolute;
 +
z-index:1;
 +
top:10%;
 +
}
 +
#whu-logo{
 +
left:7em;
 +
top:-2em;
 +
}
 +
.secmenu{
 +
vertical-align:top;
 +
padding:0;
 +
display:block;
 +
width:60px;
 +
height:60px;
 +
left:140px;
 +
top:20px;
 +
position:absolute;
 +
background-color:#fff;
 +
border-radius:60px;
 +
-moz-border-radius: 60px;
 +
-webkit-border-radius: 60px;
 +
 +
-webkit-transition: all 0.3s ease;
 +
-moz-transition: all 0.3s ease;
 +
-o-transition: all 0.3s ease;
 +
transition: all 0.3s ease;
 +
}
 +
 +
.secmenu ul{
 +
display:none;
 +
text-align:center;
 +
text-decoration:none;
 +
list-style:none;
 +
}
 +
 +
.secmenu ul li{
 +
height:40px;
 +
width:150px;
 +
background-color:#fff;
 +
display:inline;
 +
float:left;
 +
text-decoration:none;
 +
}
 +
 +
.secmenu ul li a{
 +
line-height:20px;
 +
font-family: 'Lato', sans-serif;
 +
font-size:18px;
 +
color:#000;
 +
display:block;
 +
text-decoration:none;
 +
-webkit-transition: all 0.3s ease;
 +
-moz-transition: all 0.3s ease;
 +
-o-transition: all 0.3s ease;
 +
transition: all 0.3s ease;
 +
}
 +
 +
.secmenu ul li a:hover{
 +
-webkit-transform: rotateY(30deg);
 +
-moz-transform: rotateY(30deg);
 +
-ms-transform: rotateY(30deg);
 +
transform: rotateY(30deg);
 +
background-color:#000;
 +
color:#FFF;
 +
}
 +
 +
.text{
 +
position:absolute;
 +
top:300px;
 +
z-index:1;
 +
}
 +
#bg{
 +
position:absolute;
 +
top:4%;
 +
z-index:1;
 +
opacity:0.05;
 +
}
 +
#pagenum{
 +
position:absolute;
 +
left:70px;
 +
top:635px;
 +
z-index:3;
 +
}
 +
#board{
 +
position:absolute;
 +
z-index:2;
 +
}
 +
 +
.footer{
 +
position:absolute;
 +
z-index:0;
 +
top:86.5%;
 +
}
 +
 +
.textarea{
 +
width:700px;
 +
height:1000px;
 +
margin-left:105px;
 +
margin-top:50px;
 +
padding-left:200px;
 +
padding-right:200px;
 +
padding-top:100px;
 +
border-width:2px;
 +
background-color:#FFF;
 +
}
 +
 +
.editarea{
 +
display:none;
 +
}
 +
 +
.member{
 +
display:block;
 +
border:2px solid #999;
 +
margin-top:50px;
 +
}
 +
 +
h2{
 +
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
 +
}
 +
span{
 +
display:block;
 +
font-family:Tahoma, Geneva, sans-serif;
 +
font-size:18px;
 +
                text-indent:2em;
 +
}
 +
</style>  
 +
<script>
 +
function fun(i)
 +
{
 +
document.getElementById("sec").style.width="60px";
 +
for(n=1;n<=6;n++){
 +
document.getElementById("tit"+n).style.display="none";
 +
}
 +
setTimeout('document.getElementById("sec").style.width="1000px"',500);
 +
setTimeout("document.getElementById('tit"+i+"').style.display='block'",800);
 +
}
 +
function myfun(){
 +
fun(1);
 +
                num_member=1;
 +
setTimeout("document.getElementById('member"+num_member+"').style.display='block'",1200);
 +
document.getElementById("pagenum").src="images/num"+num_member+".png";
 +
}
 +
window.onload=myfun;
 +
function next_member(){
 +
if(num_member==9){
 +
alert("the last page");
 +
return ;
 +
}
 +
document.getElementById("member"+num_member).style.display="none";
 +
num_member++;
 +
document.getElementById("member"+num_member).style.display="block";
 +
document.getElementById("pagenum").src="images/num"+num_member+".png";
 +
}
 +
function pre_member(){
 +
if(num_member==1){
 +
alert("the first page");
 +
return ;
 +
}
 +
document.getElementById("member"+num_member).style.display="none";
 +
num_member--;
 +
document.getElementById("member"+num_member).style.display="block";
 +
document.getElementById("pagenum").src="images/num"+num_member+".png";
 +
}
 +
</script>
 +
<body>
 +
    <div class="left">
 +
    </div>
 +
<div class="container">
 +
    <img src="https://static.igem.org/mediawiki/2015/e/ea/WHU-China_4.png" />
 +
    <div class="header">
 +
        <div class="header-left">
 +
            <img src="https://static.igem.org/mediawiki/2015/f/f4/WHU-China_6.png" />
 +
            </div>
 +
            <div class="header-right">
 +
            <ul>
 +
                <li>
 +
                        <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Homepage"><img src="https://static.igem.org/mediawiki/2015/9/99/WHU-China_H.png" width="100px" height="118px"/></a>
 +
                        </nav>
 +
                    </li>
 +
                    <li style="margin-left:100px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Team"><img src="https://static.igem.org/mediawiki/2015/1/18/WHU-China_TE1.png" onclick="fun(1)"  /></a>
 +
                  </nav>
 +
                    </li>
 +
                    <li style="position:absolute;margin-left:172px;bottom:-23px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Project"><img src="https://static.igem.org/mediawiki/2015/9/97/WHU-China_PR1.png" onclick="fun(2)"  /></a>
 +
                  </nav>
 +
                    </li>
 +
                    <li style="position:absolute;margin-left:262px;bottom:24px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Parts"><img src="https://static.igem.org/mediawiki/2015/9/92/WHU-China_PA1.png" onclick="fun(3)" /></a>
 +
                  </nav>
 +
                    </li>
 +
                    <li style="position:absolute;margin-left:338px;bottom:37px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Notebook"><img src="https://static.igem.org/mediawiki/2015/f/f0/WHU-China_NO1.png" onclick="fun(4)" /></a>
 +
                  </nav>
 +
                    </li>
 +
                    <li style="position:absolute;margin-left:449px;bottom:3px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Practices"><img src="https://static.igem.org/mediawiki/2015/6/63/WHU-China_HP1.png" onclick="fun(5)" /></a>
 +
                  </nav>
 +
                    </li>
 +
                    <li style="position:absolute;margin-left:540px;bottom:-22px">
 +
                    <nav>
 +
                        <a href="https://2015.igem.org/Team:WHU-China/Modeling"><img src="https://static.igem.org/mediawiki/2015/2/29/WHU-China_MO1.png" /></a>
 +
                  </nav>
 +
                    </li>
 +
                </ul>
 +
            </div>
 +
        </div>
 +
        <!--header end-->
 +
        <div class="middle-left">
 +
        <img src="https://static.igem.org/mediawiki/2015/2/20/WHU-China_3.png" />
 +
            <img src="https://static.igem.org/mediawiki/2015/3/34/WHU-China_10.png" id="whu-logo"/>
 +
            <div class="secmenu" id="sec">
 +
                <ul id="tit1">
 +
                    <li><a href="https://2015.igem.org/Team:WHU-China/Team">Member</a></li>
 +
                    <li><a href="https://2015.igem.org/Team:WHU-China/Attributions">Attributions</a></li>
 +
                    <li><a href="https://2015.igem.org/Team:WHU-China/Collaborations">Collaborations</a></li>
 +
                </ul>
 +
                <ul id="tit2">
 +
                    <li><a href="javascript:return false;">Overview</a></li>
 +
                    <li><a href="javascript:return false;">Design</a></li>
 +
                    <li><a href="javascript:return false;">Criticality Detector</a></li>
 +
                    <li><a href="javascript:return false;">Binary System</a></li>
 +
                    <li><a href="javascript:return false;">Dental Caries Prevention</a></li>
 +
                    <li><a href="javascript:return false;">Results</a></li>
 +
                </ul>
 +
                <ul id="tit3">
 +
                    <li><a href="https://2015.igem.org/Team:WHU-China/Parts">Team Parts</a></li>
 +
                    <li><a href="https://2015.igem.org/Team:WHU-China/Basic_Parts">Basis Parts</a></li>
 +
                    <li><a href="https://2015.igem.org/Team:Example/Composite_Part">Composite Parts</a></li>
 +
                    <li><a href="javascript:return false;">Favorite Parts</a></li>
 +
                </ul>
 +
                <ul id="tit4">
 +
                    <li><a href="https://2015.igem.org/Team:Example/Safety">Safety</a></li>
 +
                    <li><a href="javascript:return false;">Protocols</a></li>
 +
                </ul>
 +
                <ul id="tit5">
 +
                    <li><a href="https://2015.igem.org/Team:Example/Practices">Meet ups</a></li>
 +
                    <li><a href="javascript:return false;">Sketch in dishes</a></li>
 +
                    <li><a href="javascript:return false;">Smile mates</a></li>
 +
                </ul>
 +
                <ul id="tit6">
 +
                   
 +
                </ul>
 +
            </div>
 +
        </div>
 +
        <!-- middle end -->
 +
        <div class="text">
 +
        <img src="https://static.igem.org/mediawiki/2015/7/7c/WHU-China_1.png" id="bg" />
 +
        <img src="https://static.igem.org/mediawiki/2015/f/f7/WHU-China_5.png" id="board" usemap="#planetmap" />
 +
        <img src="https://static.igem.org/mediawiki/2015/3/3c/WHU-China_num1.png" id="pagenum" />
 +
        <map name="planetmap" id="planetmap">
 +
        <!-- next page -->
 +
        <area
 +
            shape="circle"
 +
            coords="120,360,50"
 +
            title="next page"
 +
            target ="_blank"
 +
            alt="圆形" />
 +
        <!-- previous page -->
 +
        <area
 +
        shape="circle"
 +
            coords="120,990,50"
 +
            title="previous page"
 +
            target ="_blank"
 +
            alt="圆形" />
 +
        />
 +
        </map>
 +
        <div class="textarea">
 +
       
 +
        </div>
 +
        </div>
 +
        <!-- text area end -->
 +
        <div class="footer">
 +
        <img src="https://static.igem.org/mediawiki/2015/c/c0/WHU-China_2.png" />
 +
        </div>
 +
        <!-- footer end -->
 +
    </div>
 +
</body>
 
</html>
 
</html>

Revision as of 10:57, 10 September 2015

圆形 圆形 />