File:Shome9.jpg

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
<HTML>
-
<head>
+
<HEAD>
-
<style type="text/css">
+
  <script src="jQuery.js"></script>
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
  <style type="text/css">
-
<html xmlns="http://www.w3.org/1999/xhtml">
+
/* hiding the top section*/
-
<head>
+
body{position:absolute; top:0px; width:100%; height:auto;font-family:微软雅黑;background:transparent;}
-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
#top-section{
-
<title>无标题文档</title>
+
  height:0px;
 +
    border:none;
 +
    width:980px;
 +
    margin-left:200px;
 +
    margin:0 auto;
 +
    padding:0 0 0 0;
 +
    background-color:transparent;
 +
    overflow:hide;
 +
}
 +
#p-logo{display:none;}
 +
#search-controls{display:none;}
 +
#top{display:none;}
 +
.firstHeading{display:none;}
 +
/* end of hiding the top section*/
-
<style type="text/css">
+
/* global setting*/
 +
#globalWrapper{position:absolute; top:0px;left:0px; width:100%; padding:0 0 0 0;margin:0 0 0 0;height:100%;font-family: calibri, Arial, Helvetica, sans-serif;}
 +
#content{
 +
    background-color:transparent;
 +
    border:none;
 +
    width:100%;
 +
    height:auto;
 +
    marign:0 auto;
 +
    padding:0 0 0 0;
 +
   
 +
    }
 +
#bodyContent{
 +
    background-color:transparent;
 +
    border:none;
 +
   
 +
    }
 +
siteSub{
 +
    display:none;
 +
    border:none;
 +
    }
 +
contentSub{
 +
    display:none;
 +
    }
 +
/* end of global setting*/
-
#navigation{position:absolute;left:0px;top:0px;width:100%;height:80px;border-top:8px solid #0CC;} /*顶部  导航  一框*/
+
/*hiding the footer-box*/
-
#picture{position:absolute;left:0px;top:80px;width:100%;height:510px;border-top:10px solid #0CC;} /*图片集  二框*/
+
#footer-box{display:none;}
-
#domain{position:absolute;left:0px;top:600px;width:100%;height:300px;border:1px solid black;} /*domain  三框*/
+
#catlinks{display:none;}
-
#sponser{position:absolute;left:0px;top:900px;width:100%;height:350px;border-top:10px solid #0CC;background-color:#6CF} /*赞助  四框*/
+
/*end of hiding the footer book*/
-
#ks{position:absolute;left:0px;top:0px;width:33%;height:300px;border:1px solid black;text-align:center;} /*ks  domain  三框内*/
+
/* menu (page, edit ...) */
-
#at{position:absolute;left:33%;top:0px;width:34%;height:300px;border:1px solid black;text-align:center;} /*at  domain  三框内*/
+
#menubar {
-
#acp{position:absolute;right:0px;top:0px;width:33%;height:300px;border:1px solid black;text-align:center;} /*acp domain  三框内*/
+
    background-color:transparent;
 +
    position: relative;
 +
    float:left;
 +
    white-space: nowrap;
 +
    top:-6px;
 +
    width:980px;
 +
    z-index: 5000;
 +
    font-family: sans-serif;
 +
    font-size: 95%;
 +
    line-height: 1em;
 +
    z-index:99;
 +
   
 +
}
 +
.left-menu, .left-menu a {
 +
    text-align: left;
 +
    color:#999999;
 +
    text-transform: lowercase;
 +
}
-
/*一框*/
+
.left-menu:hover {
-
.home{position:absolute;left:250px;top:0px;width:100px;height:auto;} /*导航*/
+
    color: #D00000;
-
.parts{position:absolute;left:350px;top:0px;width:100px;height:auto;}
+
    background-color: transparent;
-
.attribution{position:absolute;left:450px;top:0px;width:100px;height:auto;}
+
}
-
.team{position:absolute;left:550px;top:0px;width:100px;height:auto;}
+
-
.notebook{position:absolute;left:650px;top:0px;width:100px;height:auto;}
+
-
.project{position:absolute;left:750px;top:0px;width:100px;height:auto;}
+
-
.human{position:absolute;left:850px;top:0px;width:100px;height:auto;}
+
-
.model{position:absolute;left:950px;top:0px;width:100px;height:auto;}
+
 +
.right-menu{width:400px; float:right}
 +
.right-menu, .right-menu a {
 +
    right: 0px;
 +
    text-align: right;
 +
    color: #999999;
 +
}
 +
#menubar ul {
 +
    color: #999999;
 +
    list-style: none;
 +
}
 +
#menubar li {
 +
    display: inline;
 +
    position: relative;
 +
    cursor: pointer;
 +
    padding-left: 0px;
 +
    padding-right: 0px;
 +
}
 +
.left-menu li a {
 +
    padding: 0px 10px 0px 0px;
 +
}
 +
.left-menu .selected {
 +
#    color: #999999;
 +
}
 +
#.left-menu .selected:hover {
 +
#    color: #999999;
 +
#}
 +
.left-menu:hover a {
 +
    color: #999999;;
 +
}
-
/*二框*/
+
.left-menu li a:hover {
-
.transhome{position:absolute;left:0px;top:0px;width:100%;height:auto;} /*HOME  透明框  二框内*/
+
    color: #D00000;
-
.transhome2{position:absolute;left:150px;bottom:10px;width:80%;height:auto;} /*蓝 透明框  二框内*/
+
    text-decoration: underline;
 +
}
 +
.right-menu li {
 +
#    background-color: transparent;
 +
}
 +
.right-menu li a {
 +
    padding: 0px 15px 0px 0px;
 +
    color: #999999;;
 +
    background-color: transparent;
 +
}
 +
.right-menu li a:hover {
 +
    color: #D00000;
 +
    text-decoration: underline;
 +
}
 +
/* end menu (edit, page ...) */
-
/*三框*/
 
-
.picks{width:350px;height:70px;} /*domain  框图*/
 
-
.picat{width:350px;height:70px;}
 
-
.picacp{width:350px;height:70px;}
 
 +
  #top{position:absolute;top:2px;left:0px;width:100%;height:68px;background-color:black;z-index:1000;}
 +
  .menubar{position:absolute;top:0px;left:10%;width:80%;height:68px;font-family:微软雅黑;text-align:center;z-index:1000;color:white;}
 +
  .menubar a{text-decoration:none;opacity:1;color:white;}
 +
  .menubar a:hover{text-decoration:underline;}
 +
  .menubar ul{list-style:none;margin-top:25px;margin-left:102px;}
 +
  .menubar ul > li{float:left;width:120px;line-height:20px;cursor:pointer; }
 +
  .menubar ul > li > ul{margin-left:0px;display:none;height:200px;width:120px;margin-top:28px;}
 +
  .menubar ul > li:hover > ul{display:block;}
 +
  .menubar ul > li > ul > li{margin-left:-70px;margin-top:2px;width:160px;line-height:40px;background-color:white;color:black;}
 +
 
 +
  .slides{position:absolute;top:70px;left:0px;width:100%;height:auto;overflow:hidden;background-color:transparent;padding:0;margin:0;z-index:500;}
 +
  .slide-pic{margin-top:0px;width:100%;height:auto;overflow:hidden;padding:0;}
 +
  .slide-pic img{width:100%;height:auto;}
 +
  .slide-pic li{display:none;}
 +
  .slide-pic li.cur{display:block;}
 +
  .slide-li li{display:inline;list-style:none;}
 +
  .slide-li a{text-decoration:none;color:#000;float:right;margin-top:-15px;display:none;}
 +
  .slide-li a:hover{color:#ccc;}
-
.textks{font-family:Arial, Helvetica, sans-serif;font-size:24px;} /*domian 介绍*/
 
-
.textat{font-family:Arial, Helvetica, sans-serif;font-size:60px;}
 
-
.textacp{font-family:Arial, Helvetica, sans-serif;font-size:60px;}
 
 +
  #subject{position:absolute;top:615px;left:0px;width:100%;height:220px;overflow:hidden;}
 +
  .sub{width:333px;height:220px;float:left;margin-left:3px;}
 +
  .sub img{position:absolute;width:333px;height:auto;z-index:500;}
 +
  .sub1{}
 +
  .sub2{}
 +
  .sub3{}
 +
  .cover{position:absolute;margin-top:166px;width:333px;height:220px;background-color:#DCF1F7;z-index:1000;}
 +
  .co1{}
 +
  #footer{position:absolute;width:100%;height:100px;left:0px;top:837px;background-color:#00c67d;}
 +
  </style>
 +
</HEAD>
-
/*四框*/
+
  <BODY>
-
.spopic1{position:absolute;left:0px;top:0px;width:20%;height:120px;} /*赞助 logo*/
+
-
.spopic2{position:absolute;left:20%;top:0px;width:20%;height:120px;}
+
-
.spopic3{position:absolute;left:40%;top:0px;width:20%;height:120px;}
+
-
.spopic4{position:absolute;left:60%;top:0px;width:20%;height:120px;}
+
-
.spopic5{position:absolute;left:80%;top:0px;width:20%;height:120px;}
+
-
.intro1{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;} /*赞助介绍*/
+
<div id="top">
-
.intro2{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
<div class="menubar">
-
.intro3{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
<ul>
-
.intro4{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
<li style="width:100px;">Home</li>
-
.intro5{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
<li style="width:100px;">Team
-
</style>
+
<ul style="height:120px;">
 +
<li>Members</li>
 +
<li>Notebook</li>
 +
<li>Attributions</li>
 +
</ul>
 +
</li>
 +
<li style="width:110px;">Project
 +
<ul >
 +
<li>Overview</li>
 +
<li>Background</li>
 +
<li>Design</li>
 +
<li>Results</li>
 +
<li>Future work</li>
 +
</ul>
 +
</li>
 +
<li style="width:110px;">Model
 +
<ul style="height:80px;">
 +
<li>Parts</li>
 +
<li>Juding</li>
 +
</ul>
 +
</li>
 +
<li>Data Page
 +
<ul style="height:80px;">
 +
<li>Overview</li>
 +
<li>Biology</li>
 +
</ul>
 +
</li>
 +
<li style="width:150px;text-align:center;margin-left:15px;">Human practice
 +
<ul style="height:160px;margin-left:-10px;">
 +
<li >Survey</li>
 +
<li>Visit and interview</li>
 +
<li>Practical analysis</li>
 +
<li >Team communication</li>
 +
</ul>
 +
</li>
 +
<li style="text-align:;width:110px;">Safety</li>
 +
</ul>
 +
</div>
 +
</div>
-
 
+
<div class="slides">
-
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">
+
<ul class="slide-pic">
-
</script>
+
<li class="cur"><img alt="" src="picture/show1.jpg" /></li>
-
 
+
<li><img alt="" src="picture/show2.jpg" /></li>             
-
<script>
+
<li><img alt="" src="picture/show3.jpg" /></li>                 
-
$(document).ready(function(){
+
<li><img alt="" src="picture/show4.jPG" /></li>  
-
$(".intro1,.intro2,.intro3,.intro4,.intro5").hide();
+
</ul>
 +
<ul class="slide-li">
 +
<li><a href="#">●</a></li>
 +
<li><a href="#">●</a></li>
 +
<li><a href="#">●</a></li>
 +
<li><a href="#">●</a></li>
 +
</ul>
 +
</div>
 +
<script type="text/javascript">
 +
$(function ($) {
 +
    if ($(".slide-pic").length > 0) {
 +
        var defaultOpts = { interval: 2000, fadeInTime: 300, fadeOutTime: 200 };
 +
        var _titles = $("ul.slide-li li");
 +
        var _titles_bg = $("ul.op li");
 +
        var _bodies = $("ul.slide-pic li");
 +
        var _count = _titles.length;
 +
        var _current = 0;
 +
        var _intervalID = null;
 +
        var stop = function () { window.clearInterval(_intervalID); };
 +
        var slide = function (opts) {
 +
            if (opts) {
 +
                _current = opts.current || 0;
 +
            } else {
 +
                _current = (_current >= (_count - 1)) ? 0 : (++_current);
 +
            };
 +
            _bodies.filter(":visible").fadeOut(defaultOpts.fadeOutTime, function () {
 +
                _bodies.eq(_current).fadeIn(defaultOpts.fadeInTime);
 +
                _bodies.removeClass("cur").eq(_current).addClass("cur");
 +
            });
 +
            _titles.removeClass("cur").eq(_current).addClass("cur");
 +
            _titles_bg.removeClass("cur").eq(_current).addClass("cur");
 +
        };
 +
        var go = function () {
 +
            stop();
 +
            _intervalID = window.setInterval(function () { slide(); }, defaultOpts.interval);
 +
        };
 +
        var itemMouseOver = function (target, items) {
 +
            stop();
 +
            var i = $.inArray(target, items);
 +
            slide({ current: i });
 +
        };
 +
        _titles.hover(function () { if ($(this).attr('class') != 'cur') { itemMouseOver(this, _titles); } else { stop(); } }, go);
 +
        _bodies.hover(stop, go);
 +
        go();
 +
    }
});
});
-
 
-
$(document).ready(function(){
 
-
$(".spopic1").mouseover(function(){
 
-
$(".intro1").fadeIn("solw");
 
-
});
 
-
});
 
-
 
-
 
</script>
</script>
-
</head>
 
-
<body>
 
-
<!--一框-->
+
<div id="subject">
-
<div id="navigation">
+
<div class="sub sub1">
-
<img class="home" src="image/1.png" />
+
<img src="hp/sub1.jpg">
-
<img class="parts" src="image/2.png" />
+
<div class="cover co1">
-
<img class="attribution" src="image/3.png" />
+
-
<img class="team" src="image/4.png" />
+
-
<img class="notebook" src="image/5.png" />
+
-
<img class="project" src="image/6.png" />
+
-
<img class="human" src="image/8(1).png" />
+
-
<img class="model" src="image/7.png" />
+
-
</div> <!--一框  完-->
+
-
 
+
-
 
+
-
<!--二框-->
+
-
<div id="picture">
+
-
 
+
-
 
+
-
<img class="transhome" src="image/1-01 (2).png" />
+
-
<img class="transhome2" src="image/4-001.png" />
+
-
</div> <!--二框  完-->
+
-
 
+
-
<!--三框-->
+
-
<div id="domain">
+
-
 
+
-
<div id="ks">
+
-
<img class="picks" src="image/05.png" />
+
-
<p class="textks">
+
-
KS
+
-
</p>
+
</div>
</div>
-
 
-
<div id="at">
 
-
<img class="picat" src="image/60.png" />
 
-
<p class="textat">
 
-
AT
 
-
</p>
 
</div>
</div>
-
 
+
<div class="sub sub2">
-
<div id="acp">
+
<img src="hp/sub1.jpg">
-
<img class="picacp" src="image/70.png" />
+
<div class="cover co2">
-
<p class="textacp">
+
-
ACP
+
-
</p>
+
</div>
</div>
-
 
-
</div> <!--三框  完-->
 
-
 
-
<!--四框-->
 
-
<div id="sponser">
 
-
 
-
<a href="http://bswyqs.cn.china.cn/">
 
-
<img class="spopic1" src="image/dongsheng.jpg" />
 
-
</a>
 
-
 
-
<a href="http://genewizsz.bioon.com.cn/">
 
-
<img class="spopic2" src="image/QQ图片20140922230123.jpg" />
 
-
</a>
 
-
 
-
<a href="http://generay.com.cn/">
 
-
<img class="spopic3" src="image/LOGO-带TM,清晰.jpg" />
 
-
</a>
 
-
 
-
<a href="http://www.transgen.com.cn/">
 
-
<img class="spopic4" src="image/QQ图片20140922230400.jpg" />
 
-
</a>
 
-
 
-
<div class="intro1">
 
</div>
</div>
-
 
+
<div class="sub sub3">
-
<div class="intro2">
+
<img src="hp/sub1.jpg">
 +
<div class="cover co3">
</div>
</div>
-
 
-
<div class="intro3">
 
</div>
</div>
-
 
+
<div class="sub sub4">
-
<div class="intro4">
+
<img src="hp/sub1.jpg">
 +
<div class="cover co4">
</div>
</div>
-
 
-
<div class="intro5">
 
</div>
</div>
-
</div> <!--四框  完-->
+
</div>
-
</body>
+
<script type="text/javascript">
-
</html>
+
-
 
+
-
 
+
-
 
+
-
 
+
-
#navigation{position:absolute;left:0px;top:0px;width:100%;height:80px;border-top:8px solid #0CC;} /*顶部  导航  一框*/
+
-
#picture{position:absolute;left:0px;top:80px;width:100%;height:510px;border-top:10px solid #0CC;} /*图片集  二框*/
+
-
#domain{position:absolute;left:0px;top:600px;width:100%;height:300px;border:1px solid black;} /*domain  三框*/
+
-
#sponser{position:absolute;left:0px;top:900px;width:100%;height:350px;border-top:10px solid #0CC;background-color:#6CF} /*赞助  四框*/
+
-
 
+
-
#ks{position:absolute;left:0px;top:0px;width:33%;height:300px;border:1px solid black;text-align:center;} /*ks  domain  三框内*/
+
-
#at{position:absolute;left:33%;top:0px;width:34%;height:300px;border:1px solid black;text-align:center;} /*at  domain  三框内*/
+
-
#acp{position:absolute;right:0px;top:0px;width:33%;height:300px;border:1px solid black;text-align:center;} /*acp domain  三框内*/
+
-
 
+
-
 
+
-
 
+
-
/*一框*/
+
-
.home{position:absolute;left:250px;top:0px;width:100px;height:auto;} /*导航*/
+
-
.parts{position:absolute;left:350px;top:0px;width:100px;height:auto;}
+
-
.attribution{position:absolute;left:450px;top:0px;width:100px;height:auto;}
+
-
.team{position:absolute;left:550px;top:0px;width:100px;height:auto;}
+
-
.notebook{position:absolute;left:650px;top:0px;width:100px;height:auto;}
+
-
.project{position:absolute;left:750px;top:0px;width:100px;height:auto;}
+
-
.human{position:absolute;left:850px;top:0px;width:100px;height:auto;}
+
-
.model{position:absolute;left:950px;top:0px;width:100px;height:auto;}
+
-
 
+
-
 
+
-
 
+
-
/*二框*/
+
-
.transhome{position:absolute;left:0px;top:0px;width:100%;height:auto;} /*HOME  透明框  二框内*/
+
-
.transhome2{position:absolute;left:150px;bottom:10px;width:80%;height:auto;} /*蓝 透明框  二框内*/
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/*三框*/
+
-
.picks{width:350px;height:70px;} /*domain  框图*/
+
-
.picat{width:350px;height:70px;}
+
-
.picacp{width:350px;height:70px;}
+
-
 
+
-
 
+
-
.textks{font-family:Arial, Helvetica, sans-serif;font-size:24px;} /*domian 介绍*/
+
-
.textat{font-family:Arial, Helvetica, sans-serif;font-size:60px;}
+
-
.textacp{font-family:Arial, Helvetica, sans-serif;font-size:60px;}
+
-
 
+
-
 
+
-
 
+
-
/*四框*/
+
-
.spopic1{position:absolute;left:0px;top:0px;width:20%;height:120px;} /*赞助  logo*/
+
-
.spopic2{position:absolute;left:20%;top:0px;width:20%;height:120px;}
+
-
.spopic3{position:absolute;left:40%;top:0px;width:20%;height:120px;}
+
-
.spopic4{position:absolute;left:60%;top:0px;width:20%;height:120px;}
+
-
.spopic5{position:absolute;left:80%;top:0px;width:20%;height:120px;}
+
-
 
+
-
.intro1{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;} /*赞助介绍*/
+
-
.intro2{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
-
.intro3{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
-
.intro4{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
-
.intro5{position:absolute;left:15%;top:130px;width:70%;height:200px;border:5px solid #0CC;}
+
-
</style>
+
-
 
+
-
 
+
-
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">
+
-
</script>
+
-
 
+
-
<script>
+
$(document).ready(function(){
$(document).ready(function(){
-
$(".intro1,.intro2,.intro3,.intro4,.intro5").hide();
+
$(".cover").mouseover(function(){
-
});
+
$(this).stop().animate({"marginTop":"0px"},300);
-
 
+
});
-
$(document).ready(function(){
+
$(".cover").mouseout(function(){
-
$(".spopic1").mouseover(function(){
+
        $(this).stop().animate({"marginTop":"166px"},300);
-
$(".intro1").fadeIn("solw");
+
});
});
});
});
-
 
-
 
</script>
</script>
-
</head>
 
-
<body>
 
-
<!--一框-->
 
-
<div id="navigation">
 
-
<img class="home" src="image/1.png" />
 
-
<img class="parts" src="image/2.png" />
 
-
<img class="attribution" src="image/3.png" />
 
-
<img class="team" src="image/4.png" />
 
-
<img class="notebook" src="image/5.png" />
 
-
<img class="project" src="image/6.png" />
 
-
<img class="human" src="image/8(1).png" />
 
-
<img class="model" src="image/7.png" />
 
-
</div> <!--一框  完-->
 
-
 
-
 
-
<!--二框-->
 
-
<div id="picture">
 
-
 
-
 
-
<img class="transhome" src="image/1-01 (2).png" />
 
-
<img class="transhome2" src="image/4-001.png" />
 
-
</div> <!--二框  完-->
 
-
 
-
<!--三框-->
 
-
<div id="domain">
 
-
 
-
<div id="ks">
 
-
<img class="picks" src="image/05.png" />
 
-
<p class="textks">
 
-
KS
 
-
</p>
 
-
</div>
 
-
 
-
<div id="at">
 
-
<img class="picat" src="image/60.png" />
 
-
<p class="textat">
 
-
AT
 
-
</p>
 
-
</div>
 
-
 
-
<div id="acp">
 
-
<img class="picacp" src="image/70.png" />
 
-
<p class="textacp">
 
-
ACP
 
-
</p>
 
-
</div>
 
-
 
-
</div> <!--三框  完-->
 
-
 
-
<!--四框-->
 
-
<div id="sponser">
 
-
 
-
<a href="http://bswyqs.cn.china.cn/">
 
-
<img class="spopic1" src="image/dongsheng.jpg" />
 
-
</a>
 
-
 
-
<a href="http://genewizsz.bioon.com.cn/">
 
-
<img class="spopic2" src="image/QQ图片20140922230123.jpg" />
 
-
</a>
 
-
 
-
<a href="http://generay.com.cn/">
 
-
<img class="spopic3" src="image/LOGO-带TM,清晰.jpg" />
 
-
</a>
 
-
 
-
<a href="http://www.transgen.com.cn/">
 
-
<img class="spopic4" src="image/QQ图片20140922230400.jpg" />
 
-
</a>
 
-
 
-
<div class="intro1">
 
-
</div>
 
-
 
-
<div class="intro2">
 
-
</div>
 
-
 
-
<div class="intro3">
 
-
</div>
 
-
 
-
<div class="intro4">
 
-
</div>
 
-
<div class="intro5">
+
<div id="footer">
</div>
</div>
-
</div> <!--四框 完-->
+
 
-
</body>
+
  </BODY>
-
</html>
+
</HTML>

Revision as of 08:00, 6 October 2014

File history

Click on a date/time to view the file as it appeared at that time.

Date/TimeThumbnailDimensionsUserComment
current07:51, 6 October 2014Thumbnail for version as of 07:51, 6 October 20142,732×1,100 (1.53 MB)Xuan303 (Talk | contribs)

There are no pages that link to this file.

Metadata