Team:HZAU-China/Team

From 2013.igem.org

(Difference between revisions)
 
(80 intermediate revisions not shown)
Line 1: Line 1:
{{:Team:HZAU-China/background-head}}
{{:Team:HZAU-China/background-head}}
<html>
<html>
 +
<head>
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 +
<style type="text/css">
 +
.zoomPan{width:800px;position:relative; }
 +
.sh{zoom:1;background:url(https://static.igem.org/mediawiki/2013/8/80/Old_wall.jpg);filter:progid:DXImageTransform.Microsoft.dropShadow(color='#54000000', OffX=2,OffY=2);-webkit-box-shadow:4px 4px 4px #666;-moz-box-shadow:4px 4px 4px #666;}
 +
#zoom{position:absolute;width:254px;height:254px;border:3px solid #fff;left:-9999px;top:0;overflow:hidden;background:#fff;}
 +
#zoom img{position:relative;}
 +
</style>
 +
</head>
 +
 +
<script type="text/javascript">
 +
//<![CDATA[
 +
function zoomBox() {this.index.apply(this, arguments)}
 +
zoomBox.prototype = {
 +
    index: function(win,zoom) {
 +
        var win=document.getElementById(win);
 +
        var box=document.getElementById(zoom);
 +
        var img=box.getElementsByTagName('IMG')[0];
 +
        var zoom=img.width/win.getElementsByTagName('IMG')[0].width;
 +
        var z=Math.round(box.offsetWidth/2);
 +
        win.onmousemove=function (e){
 +
            e = e || window.event;
 +
            var x=e.clientX,y=e.clientY, ori=win.getBoundingClientRect();
 +
            if (x>ori.right+20||y>ori.bottom+20||x<ori.left-20||y<ori.top-20)box.style.display='none';
 +
            x-=ori.left;
 +
            y-=ori.top;
 +
            box.style.left=x-z+'px';
 +
            box.style.top=y-z+'px';
 +
            img.style.left=-x*zoom+z+'px';
 +
            img.style.top=-y*zoom+z+'px';
 +
        }
 +
        win.onmouseover=function (){box.style.display=''}
 +
    }
 +
};
 +
window.onload=function (){
 +
    x=new zoomBox('zoomPan','zoom')
 +
}
 +
//]]>
 +
</script>
 +
<style>
<style>
 +
a, a:visited {
 +
    color: #fff;
 +
}
#background{
#background{
-
     background-color: #EDFFFF;
+
     background:url(https://static.igem.org/mediawiki/2013/8/80/Old_wall.jpg);
-
    margin:0;
+
     float:left;
-
    padding:0;
+
     min-heiht:400px;
-
     float: left;
+
     width: 1000px;
-
     min-height: 800px;
+
-
     width: 960px;
+
}
}
-
#sidebar {
+
#paragraphs {
-
     background-color:transparent;
+
     background:url(https://static.igem.org/mediawiki/2013/8/80/Old_wall.jpg);
-
    clear: both;
+
     float: left;
     float: left;
     height: auto;
     height: auto;
-
     width: 220px;
+
     padding-left: 80px;
-
    margin-bottom: 5px;
+
     padding-top: 10px;
-
     padding-top: 5px;
+
     padding-bottom: 10px;
-
     padding-left: 10px;
+
    width: 840px;
}
}
-
#paragraphs {
+
#background12{
-
     background-color: #EDFFFF;
+
     background:url(https://static.igem.org/mediawiki/2013/8/80/Old_wall.jpg);
-
    border: 3px solid #A1FFFF;
+
     float:left;
-
     float: right;
+
     heiht:auto;
-
     height: auto;
+
     width: 840px;
-
     margin-bottom: 5px;
+
     padding-left:80px;
-
     margin-top: 5px;
+
     padding-right:80px;
-
     padding-bottom: 5px;
+
     padding-bottom:10px;
-
     padding-top:10px;
+
-
    width: 710px;
+
}
}
</style>
</style>
-
<body>
 
-
<div id="background">
 
-
<center>
 
-
    <img width="960" height="300" src="https://static.igem.org/mediawiki/2012/5/59/My_school.JPG">
 
-
<p></p>
 
-
</center>
 
-
  <div id="sidebar">
 
-
<style>
 
-
*{margin:0px;padding:0px;}
 
-
ul.menu,
 
-
ul.menu ul {padding:0;margin:0;list-style:none;position:;width:200px;background:#ddd;font-family:arial, sans-serif;}
 
-
ul.menu {z-index:100;padding:10px;margin:0 auto;}
 
-
ul.menu ul {z-index:50;
 
-
-webkit-transition: 0.5s;
 
-
-moz-transition: 0.5s;
 
-
-ms-transition: 0.5s;
 
-
-o-transition: 0.5s;
 
-
transition: 0.5s;
 
-
}
 
-
ul.menu li {line-height:30px;position:relative;text-indent:10px;}
 
-
ul.menu > li {margin-top:2px;font-size:12px;}
 
-
ul.menu > li a {font:normal 16px/29px arial, sans-serif;color:#fff;text-decoration:none;}
 
-
ul.menu label.open {display:block;background:#c00  no-repeat 170px 12px;line-height:30px;position:relative;z-index:100;font:normal 12px/30px arial, sans-serif;color:#fff;border-radius:10px 10px 0 0;}
 
-
ul.menu label.open b {color:#ff0;}
 
-
ul.menu span {display:block;background:#c00;line-height:30px;position:relative;z-index:100;font-size: 18px;}
 
-
ul.menu label img {position:absolute;left:0;top:0;width:100%;height:30px;}
 
-
ul.menu ul li {margin-top:-30px;
 
-
-webkit-transition: 0.5s;
 
-
-moz-transition: 0.5s;
 
-
-ms-transition: 0.5s;
 
-
-o-transition: 0.5s;
 
-
transition: 0.5s;
 
-
}
 
-
ul.menu ul li a {display:block;font:normal 16px/29px arial, sans-serif;color:#000;background:#ccc;}
 
-
ul.menu ul li a:hover {background:#ddd;}
 
-
ul.menu input {position:absolute;left:-9999px;}
 
-
ul.menu li input:checked + label {background:#069;}
 
-
ul.menu li input:checked ~ ul {background:#ccc;padding-bottom:10px;}
 
-
ul.menu li input:checked ~ ul li {margin-top:0;}
 
-
ul.menu label.close {display:block;width:200px;height:30px;background:transparent url("/jscss/demoimg/201208/u-arrow.gif") no-repeat 170px 12px;line-height:30px;position:relative;left:0;z-index:90;margin-top:-30px}
 
-
ul.menu input.tabs:checked ~ label.close {display:block;z-index:200;}
 
-
ul.menu input.close:checked + label.close {display:none;}
 
-
ul.menu input.close:checked ~ ul {background:#ddd;padding-bottom:0;}
 
-
ul.menu input.close:checked ~ ul li {margin-top:-30px;}
 
-
</style>
 
-
</head>
 
-
<body>
 
-
<ul class="menu">
 
-
<li>
 
-
<input type="radio" name="tab1" id="tab1a" class="tabs">
 
-
<label for="tab1a" class="open" accesskey="2">
 
-
<a><span>Team</span></a>
 
-
</label>
 
-
<input type="radio" name="tab1" id="tab1ac" class="tabs close">
 
-
<label for="tab1ac" class="close" accesskey="3">
 
-
 
-
</label>
 
-
<ul>
 
-
<li><a href="#">-Members and Instructors</a></li>
 
-
<li><a href="#">-Attributions</a></li>
 
-
<li><a href="#">-Sponsors</a></li>
 
-
</ul>
 
-
</li>
 
-
 
-
<li>    <input type="radio" name="tab1" id="tab1b" class="tabs" checked="checked">
 
-
                <label for="tab1b" class="open" accesskey="4">
 
-
                <span>Members</span></label>
 
-
<input type="radio" name="tab1" id="tab1bc" class="tabs close">
 
-
                <label for="tab1bc" class="close" accesskey="5"></label>
 
-
<ul>
 
-
      <li><a href="#1">Xiong Le</a></li>
 
-
                      <li><a href="#2">Li Yunchuan</a></li>
 
-
                      <li><a href="#3">Zhang Shaowei</a></li>
 
-
                      <li><a href="#4">Zhou Xianlin</a></li>
 
-
                      <li><a href="#5">Bai Tao</a></li>
 
-
                      <li><a href="#6">Tan Xin</a></li>
 
-
                      <li><a href="#7">Wu Wei</a></li>
 
-
                      <li><a href="#8">Chen Jin</a></li>
 
-
                      <li><a href="#9">Yang Mian</a></li>
 
-
                      <li><a href="#10">Luo Xudong</a></li>
 
-
                      <li><a href="#11">Tian Liu</a></li>
 
-
                      <li><a href="#12">Ding Linfeng</a></li>
 
-
                      <li><a href="#13">Liu Chang</a></li>
 
-
                      <li><a href="#14">Zhang Peijing</a></li>
 
-
                      <li><a href="#15">Hong Ping</a></li>
 
-
                      <li><a href="#16">Yi Jian</a></li>
 
-
</ul>
 
-
</li>
 
-
<li>    <input type="radio" name="tab1" id="tab1c" class="tabs">
 
-
                <label for="tab1c" class="open" accesskey="6">
 
-
                <a><span>Instructors</span></a></label>
 
-
<input type="radio" name="tab1" id="tab1cc" class="tabs close">
 
-
                <label for="tab1cc" class="close" accesskey="7"></label>
 
-
<ul>
 
-
      <li><a href="#">-Zhang Hongyu</a></li>
 
-
      <li><a href="#">-Ma Binguang</a></li>
 
-
</ul>
 
-
</li>
 
-
</ul>
 
-
</body>
 
-
  </div>
 
-
  <div id="paragraphs">
 
-
<p>
 
-
<br>
 
-
</p>
 
-
<center>
 
-
<span style="font-size:46px;font-family:Cambria;margin-top:10px;line-height:80%">Members and Instructors</span>
 
-
</center>
 
-
<p>
 
-
<br>
 
-
</p>
 
<style>
<style>
-
table {
+
*{ margin:0; padding:0;}
-
    background:transparent;
+
li,ul{ list-style:none}
-
    font-size: 100%;
+
img{ border:none;}
-
}
+
.item{float:left; width:190px; padding:0 10px; height:75px; overflow:hidden;}
-
h1 {
+
.item .item-t1{ height:190px; background:#7770B4;}
-
    color: #000;
+
.item .item-b1{ height:190px; background:#8CA6C0;}
-
    font-family: Signika;
+
.item .item-t2{ height:190px; background:#FFD017;}
-
    font-size: 20pt;
+
.item .item-b2{ height:190px; background:#F3D972;}
-
    text-align: left;
+
-
    text-decoration: none;
+
-
    text-transform: none;   
+
-
}
+
-
h3{
+
-
    font-size: 100%;
+
-
    font-family: "Verdana",sans-serif;
+
-
    border-bottom: medium none;
+
-
    font-weight: bold;
+
-
}
+
-
h1,  h3, {
+
-
    background:transparent;
+
-
    color: black;
+
-
    font-weight: normal;
+
-
    margin: 0;
+
-
    padding-bottom: 0.17em;
+
-
    padding-top: 0.5em;
+
-
}
+
-
td {
+
-
    font-family: Signika;
+
-
    font-size: 20pt;
+
-
    padding-right: 10px;
+
-
    text-align: left;
+
-
    vertical-align: top;
+
-
}
+
-
tr {
+
-
    vertical-align: top;
+
-
}
+
</style>
</style>
-
<body>
 
-
<div>
+
<script>
-
    <h1>Members</h1>
+
$(document).ready(function(){
-
    <table>
+
var changeH=$(".item-t1").outerHeight();//变化的高度
-
        <tbody>
+
$(".itemwrap .item").each(function(index){
-
            <tr>
+
$(this).hover(function(){
-
              <td>
+
//mouseenter代码段
-
                  <img width="170px" height="170px"
+
$(this).find(".item-t1").stop(true).animate({"margin-top":-changeH},300);
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
},function(){
-
              </td>
+
//mouseleave代码段
-
              <td>
+
$(this).find(".item-t1").stop(true).animate({"margin-top":0},300);
-
                  <a name="1"><h3>Xiong Le</h3></a>
+
});
-
                  <p>introduction </p>
+
-
              </td>
+
})  
-
            <tr>
+
})
 +
</script>
 +
<script>
 +
$(document).ready(function(){
 +
var changeH=$(".item-t2").outerHeight();//变化的高度
 +
$(".itemwrap .item").each(function(index){
 +
$(this).hover(function(){
 +
//mouseenter代码段
 +
$(this).find(".item-t2").stop(true).animate({"margin-top":-changeH},300);
 +
},function(){
 +
//mouseleave代码段
 +
$(this).find(".item-t2").stop(true).animate({"margin-top":0},300);
 +
});
 +
 +
})  
 +
})
 +
</script>
-
              <tr>
+
<body>
-
              <td>
+
<div id="background">
-
                  <img width="170px" height="170px"  
+
    <div id="paragraphs">
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
        <div class="zoomPan" id="zoomPan">
-
              </td>
+
        <img src="https://static.igem.org/mediawiki/2013/3/3e/%E7%85%A7%E7%89%87%E6%94%B9_-%E5%8A%A0%E5%AE%BD_%E5%89%AF%E6%9C%AC.png" width="840px;">
-
              <td>
+
        <div id="zoom" class="sh"><img src="https://static.igem.org/mediawiki/2013/a/ae/%E7%85%A7%E7%89%87%E6%94%B9_-%E5%8A%A0%E5%AE%BD.png" width="3500px;"></div>
-
                  <a name="2"><h3>Li Yunchuan</h3></a>
+
        </div>
-
                  <p>introduction </p>
+
    </div>
-
              </td>
+
    <div id="background12">
-
            <tr>
+
         
 +
          <div class="itemwrap">
 +
          <div class="item">
 +
  <div class="item-t1"><p  style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Team/Members and Instructors">MEMBERS</a></p></div>
 +
          <div class="item-b1"><p  style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Team/Members and Instructors">MEMBERS</a></p></div>
 +
          </div>
 +
          </div>
 +
 +
          <div class="itemwrap">
 +
          <div class="item">
 +
  <div class="item-t2"><p style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Instructors">INSTRUCTORS</a></p></div>
 +
          <div class="item-b2"><p  style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Instructors">INSTRUCTORS</a></p></div>
 +
          </div>
 +
          </div>
-
              <tr>
+
          <div class="itemwrap">
-
              <td>
+
          <div class="item">
-
                  <img width="170px" height="170px"  
+
  <div class="item-t1"><p  style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Attributions">ATTRIBUTIONS</a></p></div>
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
          <div class="item-b1"><p  style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Attributions">ATTRIBUTIONS</a></p></div>
-
              </td>
+
          </div>
-
              <td>
+
          </div>
-
                  <a name="3"><h3>Zhang Shaowei</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
              <tr>
+
          <div class="itemwrap">
-
              <td>
+
          <div class="item">
-
                  <img width="170px" height="170px"
+
  <div class="item-t2"><p style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Sponsors">SPONSORS</a></p></div>
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
          <div class="item-b2"><p style="font-family:Arial,Helvetica,sans-serif;font-size:23px;font-color:#fff;text-align:center;padding-top:20px;padding-bottom:20px; margin:0px;"><a href="https://2013.igem.org/Team:HZAU-China/Sponsors">SPONSORS</a></p></div>
-
              </td>
+
          </div>
-
              <td>
+
          </div>
-
                  <a name="4"><h3>Zhou Xianlin</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
              <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="5"><h3>Bai Tao</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="6"><h3>Tan Xin</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="7"><h3>Wu Wei</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
           
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="8"><h3>Chen Jing</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
       
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="9"><h3>Yang Mian</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="10"><h3>Luo Xudong</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="11"><h3>Tian Liu</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="12"><h3>Ding Linfeng</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="13"><h3>Liu Chang</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="14"><h3>Zhang Peijing</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="15"><h3>Hong Ping</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
            <tr>
+
-
              <td>
+
-
                  <img width="170px" height="170px"
+
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
+
-
              </td>
+
-
              <td>
+
-
                  <a name="16"><h3>Yi Jian</h3></a>
+
-
                  <p>introduction </p>
+
-
              </td>
+
-
            <tr>
+
-
 
+
-
        </tbody>
+
-
        </table>
+
 +
    </div>
</div>
</div>
 +
</body>
-
 
-
<div>
 
-
    <h1>Instructors</h1>
 
-
    <table>
 
-
        <tbody>
 
-
            <tr>
 
-
              <td>
 
-
                  <img width="170px" height="170px"
 
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
 
-
              </td>
 
-
              <td>
 
-
                  <a name="17"><h3>Zhang Hongyu</h3></a>
 
-
                  <p>introduction </p>
 
-
              </td>
 
-
            <tr>
 
-
           
 
-
            <tr>
 
-
              <td>
 
-
                  <img width="170px" height="170px"
 
-
src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
 
-
              </td>
 
-
              <td>
 
-
                  <a name="18"><h3>Ma Binguang</h3></a>
 
-
                  <p>introduction </p>
 
-
              </td>
 
-
            <tr>
 
-
        </tbody>
 
-
        </table>
 
-
 
-
</div>
 
-
 
-
  </div>
 
-
</div>
 
-
</body>
 
</html>
</html>
-
 
{{:Team:HZAU-China/background-footer}}
{{:Team:HZAU-China/background-footer}}
<br/>
<br/>

Latest revision as of 11:53, 20 September 2013