|
|
Line 1: |
Line 1: |
| | | |
− | <html>
| |
− | <!--{{HZAU-China}}-->
| |
− | <head>
| |
− | <meta charset="UTF-8">
| |
− | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
| |
− | <meta name="viewport" content="width=device-width, minimum-scale= 1.0, initial-scale= 1.0">
| |
− | <title>Team:HZAU-China-2015.igem</title>
| |
− | </head>
| |
− | <body>
| |
− | <div class="htmleaf-container">
| |
− | <header class="htmleaf-header">
| |
− | <div class="left"><img src="Team_HZAU-China_ecoli.png" alt="logo1" /></div>
| |
− | <h1>Mixed-reality Cell<span>Bidirectinal coupling between real and virtual bio-oscillator</span></h1>
| |
− | <div class="right"><img src="Team_HZAU-China_brain.png" alt="logo2" /></div>
| |
− | </header><!--头部结束-->
| |
− |
| |
− | <div class="related">
| |
− | <div class="left_related">
| |
− | <img class="img-left" width="200px" alt="" src="https://static.igem.org/mediawiki/2014/c/cc/Hazulogo-w.png">
| |
− | <p class="copyright-text">© 2015 Huazhong Agricultural University iGEM Team. All rights reserved.</p>
| |
− | </div>
| |
− | <div class="right_related">
| |
− | <h1>Contacts</h1>
| |
− | <div class="contacts_left">
| |
− | <ul>
| |
− | <li class="address_inf">
| |
− | No.1, Shizishan Street, Hongshan District
| |
− | </br>
| |
− | 430070,P.R.China
| |
− | </li>
| |
− | <li class="email_inf">Email:hzauigem@gmail.com</li>
| |
− | </ul>
| |
− | </div>
| |
− | <div class="contacts_right">
| |
− | <ul>
| |
− | <li class="twitter-inf">Twitter : hzau_igem</li>
| |
− | <li class="wechat-inf">Wechat : hzauigem</li>
| |
− | <li class="qq-inf">QQ Group : 313297095</li>
| |
− | <li class="yt-inf">YouTube : hzauigem</li>
| |
− | </ul>
| |
− | </div>
| |
− | </div>
| |
− | </div><!--页脚结束-->
| |
− | <div style="display: none;" id="rocket-to-top">
| |
− | <div style="opacity:0;display: block;" class="level-2"></div>
| |
− | <div class="level-3"></div>
| |
− | </div><!--火箭结束-->
| |
− | </div><!--整页结束-->
| |
− |
| |
− | <!--style代码-->
| |
− | <style>
| |
− | /*改变默认的样式*/
| |
− | .firstHeading {
| |
− | visibility:hidden;
| |
− | display:none;
| |
− | }
| |
− |
| |
− | #content {
| |
− | background: transparent;
| |
− | }
| |
− | #globalWrapper, #content { /*-- changes default wiki settings --*/
| |
− | width: 100%;
| |
− | height: 100%;
| |
− | border: 0px;
| |
− | background-color: transparent;
| |
− | margin: 0px;
| |
− | padding: 0px;
| |
− | }
| |
− | html, body, .wrapper { /*-- changes default wiki settings --*/
| |
− | width: 100%;
| |
− | height: 100%;
| |
− | background-color: transparent;
| |
− | }
| |
− |
| |
− | /* default里的设置 */
| |
− | body, html {
| |
− | font-size: 100%;
| |
− | padding: 0;
| |
− | margin: 0;
| |
− | }
| |
− | *,*:after,*:before {
| |
− | -webkit-box-sizing: border-box;
| |
− | -moz-box-sizing: border-box;
| |
− | box-sizing: border-box;
| |
− | }
| |
− | body{
| |
− | font-family:Verdana,Tahoma,Arial,Sans-Serif;
| |
− | }
| |
− | h1, h2, h3, h4 {
| |
− | /*font-family: "Dosis", arial, tahoma, verdana;*/
| |
− | font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
| |
− | font-weight: 600;
| |
− | }
| |
− |
| |
− |
| |
− | /*字体的设置*/
| |
− | @font-face {
| |
− | font-family: 'Conv_JOKERMAN';
| |
− | src: url('JOKERMAN.eot');
| |
− | src: local('☺'), url('JOKERMAN.woff') format('woff'), url('JOKERMAN.ttf') format('truetype'), url('JOKERMAN.svg') format('svg');
| |
− | font-weight: normal;
| |
− | font-style: normal;
| |
− | }
| |
− | /* 头与尾的设置 */
| |
− | .htmleaf-container{
| |
− | background-color:#000000;
| |
− | margin: 0 auto;
| |
− | overflow: hidden;
| |
− | font-family:;
| |
− | }
| |
− | header {
| |
− | background-color: #000000;
| |
− | padding: 10px;
| |
− | -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05);
| |
− | -moz-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05);
| |
− | -ms-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05);
| |
− | box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05);
| |
− | }
| |
− | .htmleaf-header{
| |
− | padding: 1em 190px 1em;
| |
− | letter-spacing: -1px;
| |
− | text-align: center;
| |
− | }
| |
− | .htmleaf-header .left{
| |
− | position: absolute;
| |
− | top:0px;
| |
− | left:0px;
| |
− | }
| |
− | .htmleaf-header .right{
| |
− | position: absolute;
| |
− | top:0px;
| |
− | right: 0px;
| |
− | }
| |
− |
| |
− | .htmleaf-header h1 {
| |
− | color: #fff;
| |
− | font-weight: 600;
| |
− | font-size: 50px;
| |
− | line-height: 1;
| |
− | margin-bottom: 0;
| |
− | font-family: 'Conv_JOKERMAN',sans-serif;
| |
− | }
| |
− | .htmleaf-header h1 span {
| |
− | font-family: 'Conv_JOKERMAN',sans-serif;
| |
− | display: block;
| |
− | font-size: 60%;
| |
− | font-weight: 400;
| |
− | padding: 0.8em 0 0.5em 0;
| |
− | color: #c3c8cd;
| |
− | }
| |
− | .related {
| |
− | font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
| |
− | color: #fff;
| |
− | background: #000000;
| |
− | font-size: 1.25em;
| |
− | /*padding: 0.5em 0;*/
| |
− | padding-bottom:50px;
| |
− | overflow: hidden;
| |
− | width:80%;
| |
− | position:relative;
| |
− | margin:0 auto;
| |
− | }
| |
− | .left_related{
| |
− | float:left;
| |
− | width:30%;
| |
− | margin:30px 0px 0px 50px;
| |
− | }
| |
− | .right_related{
| |
− | margin:10px 0px 0px 40px;
| |
− | float:left;
| |
− | }
| |
− | .contacts_right{
| |
− | position:absolute;
| |
− | right:140px;
| |
− | top:60px;
| |
− | }
| |
− |
| |
− | /*小火箭的设置*/
| |
− | *{list-style:none;border:0;}
| |
− | #rocket-to-top div {
| |
− | left: 0;
| |
− | margin: 0;
| |
− | overflow: hidden;
| |
− | padding: 0;
| |
− | position: absolute;
| |
− | top: 0;
| |
− | width: 149px;
| |
− | }
| |
− | #rocket-to-top .level-2 {
| |
− | background: url("Team_HZAU-China_rocket_button_up.png") no-repeat scroll -149px 0 transparent;
| |
− | display: none;
| |
− | height: 250px;
| |
− | opacity: 0;
| |
− | z-index: 1;
| |
− | }
| |
− | #rocket-to-top .level-3 {
| |
− | background: none repeat scroll 0 0 transparent;
| |
− | cursor: pointer;
| |
− | display: block;
| |
− | height: 150px;
| |
− | z-index: 2;
| |
− | }
| |
− | #rocket-to-top {
| |
− | background: url("Team_HZAU-China_rocket_button_up.png") no-repeat scroll 0 0 transparent;
| |
− | cursor: default;
| |
− | display: block;
| |
− | height: 250px;
| |
− | margin: -125px 0 0;
| |
− | overflow: hidden;
| |
− | padding: 0;
| |
− | position: fixed;
| |
− | right: 0;
| |
− | top: 80%;
| |
− | width: 149px;
| |
− | z-index: 11;
| |
− | }
| |
− |
| |
− | </style>
| |
− | <script type="text/javascript">
| |
− | $(function() {
| |
− | var e = $("#rocket-to-top"),
| |
− | t = $(document).scrollTop(),
| |
− | n,
| |
− | r,
| |
− | i = !0;
| |
− | $(window).scroll(function() {
| |
− | var t = $(document).scrollTop();
| |
− | t == 0 ? e.css("background-position") == "0px 0px" ? e.fadeOut("slow") : i && (i = !1, $(".level-2").css("opacity", 1), e.delay(100).animate({
| |
− | marginTop: "-1000px"
| |
− | },
| |
− | "normal",
| |
− | function() {
| |
− | e.css({
| |
− | "margin-top": "-125px",
| |
− | display: "none"
| |
− | }),
| |
− | i = !0
| |
− | })) : e.fadeIn("slow")
| |
− | }),
| |
− | e.hover(function() {
| |
− | $(".level-2").stop(!0).animate({
| |
− | opacity: 1
| |
− | })
| |
− | },
| |
− | function() {
| |
− | $(".level-2").stop(!0).animate({
| |
− | opacity: 0
| |
− | })
| |
− | }),
| |
− | $(".level-3").click(function() {
| |
− | function t() {
| |
− | var t = e.css("background-position");
| |
− | if (e.css("display") == "none" || i == 0) {
| |
− | clearInterval(n),
| |
− | e.css("background-position", "0px 0px");
| |
− | return
| |
− | }
| |
− | switch (t){
| |
− | case "0px 0px":
| |
− | e.css("background-position", "-298px 0px");
| |
− | break;
| |
− | case "-298px 0px":
| |
− | e.css("background-position", "-447px 0px");
| |
− | break;
| |
− | case "-447px 0px":
| |
− | e.css("background-position", "-596px 0px");
| |
− | break;
| |
− | case "-596px 0px":
| |
− | e.css("background-position", "-745px 0px");
| |
− | break;
| |
− | case "-745px 0px":
| |
− | e.css("background-position", "-298px 0px");
| |
− | }
| |
− | }
| |
− | if (!i) return;
| |
− | n = setInterval(t, 50),
| |
− | $("html,body").animate({scrollTop: 0},"slow");
| |
− | });
| |
− | });
| |
− | </script>
| |
− |
| |
− | </body>
| |
− | </html>
| |