Difference between revisions of "Team:China Tongji/test"

Line 1: Line 1:
−
<!-- <!DOCTYPE html> -->
 
−
<html lang="en">
 
  
 +
 +
<!DOCTYPE html>
 +
<html>
 
<head>
 
<head>
−
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
<script type="text/javascript"></script>
−
 
+
$(document).ready(function(){
−
<style type="text/css">
+
  $(".flip").mouseenter(function(){
−
 
+
    $(".panel").slideDown("slow");
−
#globalWrapper{
+
  });
−
    padding-bottom:0px;
+
  $(".flip").mouseleave(function(){
 +
    $(".panel").slideUp("slow");
 +
  });
 +
});
 +
</script>
 +
 +
<style type="text/css">  
 +
div.panel,p.flip
 +
{
 +
margin:0px;
 +
padding:5px;
 +
text-align:center;
 +
background:#e5eecc;
 +
border:solid 1px #c3c3c3;
 
}
 
}
−
 
+
div.panel
−
#content{
+
{
−
        width:auto;
+
height:120px;
−
        margin:0px auto;
+
display:none;
−
        padding:0px;
+
−
        border:none;
+
−
background-color: #F0F0F0;
+
−
}
+
−
.firstHeading{
+
−
display:none;
+
−
}
+
−
 
+
−
 
+
−
.head{
+
−
position: fixed;
+
−
        left:0px;
+
−
top:18px;
+
−
width: 100%;
+
−
height: 60px;
+
−
background:url(https://static.igem.org/mediawiki/2015/8/8c/Team_China_Tongji-transparent-nav.png);
+
−
border-bottom: thin solid #CCC;
+
−
z-index:1000;
+
−
}
+
−
.head:hover{
+
−
background: #FFF;
+
−
}
+
−
 
+
−
#navLogoLeft{
+
−
float:left;
+
−
margin-left:15px;
+
−
margin-right:20px;
+
−
 
+
−
}
+
−
#navLogoLeft img{
+
−
border:0px;
+
−
}
+
−
#navLogoRight{
+
−
float:right;
+
−
margin-right:10px;
+
−
padding:5px;
+
−
}
+
−
#navLogoRight img{
+
−
border:0px;
+
−
}
+
−
 
+
−
.nav {
+
−
float:left;
+
−
}
+
−
.navFirstTitle{
+
−
line-height: 60px;
+
−
text-decoration: none;
+
−
padding: 10px 12px;
+
−
text-transform: uppercase;
+
−
font-family: "Comic Sans MS", cursive,Georgia;
+
−
font-size: 14px;
+
−
}
+
−
.navFirstTitle:hover{
+
−
background-color:#CCC;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
.bigName h1{
+
−
z-index: 3;
+
−
color: #F0F;
+
−
text-align: left;
+
−
padding-left:100px;
+
−
line-height: 300px;
+
−
font-size: 90px;
+
−
font-family: Verdana, Geneva, sans-serif;
+
−
font-weight: bolder;
+
−
text-transform: uppercase;
+
−
}
+
−
.myContent{
+
−
width:1000px;
+
−
margin:0px auto;
+
−
min-height:300px;
+
−
padding:0px;
+
−
background-color: #F0F0F0;
+
−
}
+
−
 
+
−
 
+
−
.foot{
+
−
width:100%;
+
−
height:100px;
+
−
background-color:#404040;
+
−
        z-index:500;
+
−
}
+
−
.navFoot{
+
−
margin-top:0px;
+
−
padding-top:20px;
+
−
}
+
−
.navFoot a{
+
−
text-transform: uppercase;
+
−
text-decoration: none;
+
−
padding: 10px;
+
−
color: #D2D2D2;
+
−
font-family: Georgia, "Times New Roman", Times, serif;
+
−
font-size:12px;
+
−
}
+
−
.navFoot a:hover{
+
−
text-decoration:underline;
+
−
}
+
−
.copyright{
+
−
color: #8C8C8C;
+
−
font-family: Georgia, "Times New Roman", Times, serif;
+
−
font-size: 11px;
+
 
}
 
}
 
</style>
 
</style>
−
 
−
<script>
 
−
 
−
</script>
 
−
 
 
</head>
 
</head>
−
 
+
−
 
+
<body>
−
 
+
<p class="flip">请点击这里</p>
−
<!--head start-->
+
<div class="panel">
−
<div class="head">
+
<p>W3School - 领先的 Web 技术教程站点</p>
−
<div id="navLogoLeft">
+
<p>在 W3School，你可以找到你所需要的所有网站建设教程。</p>
−
        <a href="https://igem.org/Team.cgi?year=2015&amp;team_name=China_Tongji">
+
−
        <img src="https://static.igem.org/mediawiki/2015/9/9b/China_Tongji_team-logo-60px.png"/>
+
−
        </a>
+
−
    </div>
+
−
    <div class="nav">
+
−
    <tr>
+
−
            <td><a class="navFirstTitle" id="Home" href="https://2015.igem.org/Team:China_Tongji">Home</a></td>
+
−
            <td><a class="navFirstTitle" id="Project" href="https://2015.igem.org/Team:China_Tongji/Project">Project</a>
+
−
            </td>
+
−
            <td><a class="navFirstTitle" id="Notebook" href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></td>
+
−
            <td><a class="navFirstTitle" id="Achivement" href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a>
+
−
            </td>
+
−
            <td><a class="navFirstTitle" id="Team" href="https://2015.igem.org/Team:China_Tongji/Team">Team</a></td>
+
−
            <td><a class="navFirstTitle" id="Outreach" href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></td>
+
−
            <td><a class="navFirstTitle" id="Safety" href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></td>
+
−
      </tr>
+
−
    </div> 
+
−
    <div id="navLogoRight">
+
−
        <a href="https://2015.igem.org/Main_Page">
+
−
            <img src="https://static.igem.org/mediawiki/2015/4/47/China_Tongji-logo-right.png" alt="China_Tongji"/>
+
−
        </a>
+
−
    </div>  
+
 
</div>
 
</div>
 +
  
−
<!--content start-->
+
   
−
<div class="bigName">
+
</body>
−
<h1 align="left">Project</h1>
+
−
</div>
+
−
 
+
−
<div class="myContent">
+
−
<p>首先是上面的菜单，最好可以像复旦这样可以随着滑动页面也跟着改动（复旦有一点问题是他们挡住了最上面的edit栏，都给移到了右边的Igem bar里面，这次应该不可以，第二个HZAU连接里面留住了edit 栏，可以参考这个），然后这一栏像他们一样可以点击的稍微大一点，醒目一点~ 然后我们也想要能在菜单左边有一块位置放我们的logo这个刚刚画好，还没有最后定稿，大概是这风格，所以整体色调和色卡选择最好可以和Logo匹配~。就是各个大标题和大背景色可不可以是那种淡淡的暖黄色~。</p>
+
−
<p>其次我们想要像HZAU一样主页最上面是一个那种图栏，有几张图片（一张线虫一张合影等）可以切换。</p>
+
−
<p>最后就是复旦他们每点进去一个主题，左边会有一栏竖着的分主题list, 会随着网页看到哪里而改变显示的位置，（像上面图片上那样）这个我们比较想要加入到我们的那些分页面里~不知道可不可以实现？</p>
+
−
<p>&nbsp;</p>
+
−
<p>中间内容测试内容！</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>中间内容测试内容！</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>
+
−
<p>中间内容测试内容！</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>
+
−
</div>
+
−
 
+
−
 
+
−
<!--foot start-->
+
−
<div class="foot">
+
−
    <div class="navFoot" align="center">
+
−
    <tr align="center">
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji">Home</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Project">Project</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Notebook">Notebook</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Achivement">Achivement</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Team">Team</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Outreach">Outreach</a></td><td>|</td>
+
−
            <td><a href="https://2015.igem.org/Team:China_Tongji/Safety">Safety</a></td><td></td>
+
−
      </tr>
+
−
    </div>   
+
−
    <div class="copyright"><center><p>Copyright © China_Tongji iGEM 2015 | Developer: LiJunWu </p></center></div>
+
−
</div>
+
−
 
+
−
<!--当前页面指示-->
+
−
<script defer>
+
−
var keyWord = location.href.substring(39);
+
−
switch (keyWord)
+
−
{
+
−
  case "ome":
+
−
document.getElementById("Home").style.color = "#F0F";
+
−
break;
+
−
  case "Project":
+
−
document.getElementById("Project").style.color = "#F0F";
+
−
break;
+
−
  case "Notebook":
+
−
document.getElementById("Notebook").style.color = "#F0F";
+
−
break;
+
−
  case "Achivement":
+
−
document.getElementById("Achivement").style.color = "#F0F";
+
−
break;
+
−
  case "Team":
+
−
document.getElementById("Team").style.color = "#F0F";
+
−
break;
+
−
  case "Outreach":
+
−
document.getElementById("Outreach").style.color = "#F0F";
+
−
break;
+
−
  case "Safety":
+
−
document.getElementById("Safety").style.color = "#F0F";
+
−
break;
+
−
}
+
−
</script>
+
−
 
+
−
 
+
 
</html>
 
</html>

Revision as of 21:47, 17 July 2015


<!DOCTYPE html> $(document).ready(function(){ $(".flip").mouseenter(function(){ $(".panel").slideDown("slow"); }); $(".flip").mouseleave(function(){ $(".panel").slideUp("slow"); }); });

请点击这里

W3School - 领先的 Web 技术教程站点

在 W3School，你可以找到你所需要的所有网站建设教程。