Template:Team:SCUT/Model/mainhead

From 2014.igem.org

(Difference between revisions)
(Created page with "<html> <body> <div id="left"> <div class="navihead navihead1"> <img src="https://static.igem.org/mediawiki/2014/d/dc/1-01.png"> </div> <div class="navibody navibody1"> <p onclick="scro...")
 
(69 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<head>
 +
<style type="text/css">
 +
  p.atop{margin-top:35px;margin-left:0px;width:770px;height:30px;line-height:30px;text-align:left;}
 +
  p.atop span{font-size:35px;color:#92E0BD;}
 +
  #combine{margin:0 auto;width:980px;}
 +
  .mainbody{width:770px;height:auto;border:1px solid #e3e3e3;margin-top:40px;margin-left:210px;}
 +
  .mainbody1{margin-top:0px;}
 +
  .mainbody p{margin:35px;text-align:justify;font-size:18px;font-family:Segoe UI Symbol;color:gray;line-    height:40px;color:#333333;font-weight:lighter;}
 +
  .mainbody p#equ{text-align:center;margin:-30px 0;}
 +
  .mainbody p span{color:black;}
 +
  .mainbody span.xiaobiaoti{font-size:22px;color:black;}
 +
  .mainbody p.zhujie{text-align:left;margin:15px 35px 15px 35px;font-size:15px;}
 +
  .mainbody p.m-zhujie{text-align:center;margin:10px 0;font-size:15px;}
 +
  .mainbody p.image{width:770px;text-align:center;margin:0 auto;}
 +
  .mainbody p a{width:770px;color:#0088cc;}
 +
  span#yin{color:#0088cc;cursor:pointer;}
 +
  a#special{text-decoration:none;font-size:16px;}
 +
</style>
 +
</head>
<body>
<body>
-
<div id="left">
+
<script type="text/javascript">
-
<div class="navihead navihead1">
+
function scroll(element){
-
<img src="https://static.igem.org/mediawiki/2014/d/dc/1-01.png">
+
var eletop = element.offset().top;
-
</div>
+
$("body,html").animate({scrollTop:eletop},600);
-
<div class="navibody navibody1">
+
}
-
<p onclick="scroll_1()">Background</p>
+
function scroll_1(){
-
<p onclick="scroll_2()">Rubisco simulation</p>
+
var element = $("#label_1");
-
<p onclick="scroll_3()">N-butanol simulation</p>
+
scroll(element);
-
</div>
+
}
-
<div class="navihead navihead2">
+
function scroll_2(){
-
<img src="https://static.igem.org/mediawiki/2014/0/0c/2-01.png">
+
var element = $("#label_2");
-
</div>
+
scroll(element);
-
<div class="navibody navibody2">
+
}
-
<p>Individual part</p>
+
function scroll_3(){
-
<p>Combine part</p>
+
var element = $("#label_3");
-
<p>The function of Rubisco</p>
+
scroll(element);
-
<p>Scaffold</p>
+
}
-
</div>
+
function scroll_4(){
-
<div class="navihead navihead3">
+
        var element = $("#label_4");
-
<img src="https://static.igem.org/mediawiki/2014/1/16/3-01.png">
+
        scroll(element);
-
</div>
+
}
-
<div class="navibody navibody3">
+
function scroll_5(){
-
<p>Background</p>
+
        var element = $("#label_5");
-
<p>Rubisco simulation</p>
+
        scroll(element);
-
<p>N-butanol simulation</p>
+
}
-
</div>
+
function scroll_6(){
-
<div class="navihead navihead4">
+
        var element = $("#label_6");
-
<img src="https://static.igem.org/mediawiki/2014/a/ab/4-01.png">
+
        scroll(element);
-
</div>
+
}
-
<div class="navibody navibody4">
+
</script>
-
<p>Background</p>
+
 
-
<p>Rubisco simulation</p>
+
<script type="text/javascript">
-
<p>N-butanol simulation</p>
+
function scroll(element){
-
</div>
+
var eletop_1 = element.offset().top;
-
<div class="navihead navihead5">
+
$("body,html").animate({scrollTop:eletop_1},600);
-
<img src="https://static.igem.org/mediawiki/2014/7/7f/5-01.png">
+
}
-
</div>
+
function scroll_a(){
-
<div class="navibody navibody5">
+
var element = $("#cite");
-
<p>Background</p>
+
scroll(element);
-
<p>Rubisco simulation</p>
+
}
-
<p>N-butanol simulation</p>
+
</script>
-
</div>
+
 
-
</div>
+
 
</body>
</body>
</html>
</html>

Latest revision as of 03:54, 18 October 2014