@@ Line 1: / Line 1: @@
 {{:Team：HZAU-China/background-head}}
 <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>
+a, a:visited {
+    color: #fff;
+}
 #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;
      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>
-<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;}
+*{ margin:0; padding:0;}
-ul.menu,
+li,ul{ list-style:none}
-ul.menu ul {padding:0;margin:0;list-style:none;position:;width:200px;background:#ddd;font-family:arial, sans-serif;}
+img{ border:none;}
-ul.menu {z-index:100;padding:10px;margin:0 auto;}
+.item{float:left; width:190px; padding:0 10px; height:75px; overflow:hidden;}
-ul.menu ul {z-index:50;
+.item .item-t1{ height:190px; background:#7770B4;}
-	-webkit-transition: 0.5s;
+.item .item-b1{ height:190px; background:#8CA6C0;}
-	-moz-transition: 0.5s;
+.item .item-t2{ height:190px; background:#FFD017;}
-	-ms-transition: 0.5s;
+.item .item-b2{ height:190px; background:#F3D972;}
-	-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>
-<body>
+<script>
-<ul class="menu">
+$(document).ready(function(){
-	<li>
+	var changeH=$(".item-t1").outerHeight();//变化的高度
-		<input type="radio" name="tab1" id="tab1a" class="tabs">
+	$(".itemwrap .item").each(function(index){
-		<label for="tab1a" class="open" accesskey="2">
+		$(this).hover(function(){
-		<a><span>Team</span></a>
+			//mouseenter代码段
-		</label>
+			$(this).find(".item-t1").stop(true).animate({"margin-top":-changeH},300);
-		<input type="radio" name="tab1" id="tab1ac" class="tabs close">
+		},function(){
-		<label for="tab1ac" class="close" accesskey="3">
+			//mouseleave代码段
+			$(this).find(".item-t1").stop(true).animate({"margin-top":0},300);
-		</label>
+		});
-		<ul>
-			<li><a href="#">-Members and Instructors</a></li>
+	})
-			<li><a href="#">-Attributions</a></li>
+})
-			<li><a href="#">-Sponsors</a></li>
+</script>
-		</ul>
+<script>
-	</li>
+$(document).ready(function(){
+	var changeH=$(".item-t2").outerHeight();//变化的高度
-	<li>    <input type="radio" name="tab1" id="tab1b" class="tabs" checked="checked">
+	$(".itemwrap .item").each(function(index){
-                <label for="tab1b" class="open" accesskey="4">
+		$(this).hover(function(){
-                <span>Members</span></label>
+			//mouseenter代码段
-		<input type="radio" name="tab1" id="tab1bc" class="tabs close">
+			$(this).find(".item-t2").stop(true).animate({"margin-top":-changeH},300);
-                <label for="tab1bc" class="close" accesskey="5"></label>
+		},function(){
-		<ul>
+			//mouseleave代码段
-		       <li><a href="#1">Xiong Le</a></li>
+			$(this).find(".item-t2").stop(true).animate({"margin-top":0},300);
-                       <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>
+</script>
-                       <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>
-table {
-    background:transparent;
-    font-size: 100%;
-}
-h1 {
-    color: #000;
-    font-family: Signika;
-    font-size: 20pt;
-    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>
 <body>
+<div id="background">
+    <div id="paragraphs">
+        <div class="zoomPan" id="zoomPan">
+        <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;">
+        <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>
+        </div>
+    </div>
+    <div id="background12">
+          <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>
-<div>
+          <div class="itemwrap">
-    <h1>Members</h1>
+          <div class="item">
-    <table>
+	  <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>
-        <tbody>
+          <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>
-            <tr>
+          </div>
-              <td>
+          </div>
-                   <img width="170px" height="170px"
-src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
-              </td>
-              <td>
-                   <a name="1"><h3>Xiong Le</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="2"><h3>Li Yunchuan</h3></a>
-                   <p>introduction </p>
-              </td>
-            <tr>
-              <tr>
+     </div>
-              <td>
+</div>
-                   <img width="170px" height="170px"
+</body>
-src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg">
-              </td>
-              <td>
-                   <a name="3"><h3>Zhang Shaowei</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="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>
+</html>
-              <td>
+{{:Team：HZAU-China/background-footer}}
-                   <img width="170px" height="170px"
+<br/>
-src="https://static.igem.org/mediawiki/2012/7/71/3human_practice.jpg

Team:HZAU-China/Team

From 2013.igem.org

Latest revision as of 11:53, 20 September 2013