|
|
| Line 1: |
Line 1: |
| - | <HTML>
| |
| - | <HEAD>
| |
| - | <script src="jQuery.js"></script>
| |
| - | <style type="text/css">
| |
| - | /* hiding the top section*/
| |
| - | body{position:absolute; top:0px; width:100%; height:auto;font-family:微软雅黑;background:transparent;}
| |
| - | #top-section{
| |
| - | 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*/
| |
| | | | |
| - | /* 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*/
| |
| - |
| |
| - | /*hiding the footer-box*/
| |
| - | #footer-box{display:none;}
| |
| - | #catlinks{display:none;}
| |
| - | /*end of hiding the footer book*/
| |
| - |
| |
| - | /* menu (page, edit ...) */
| |
| - | #menubar {
| |
| - | 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 {
| |
| - | color: #D00000;
| |
| - | background-color: transparent;
| |
| - | }
| |
| - |
| |
| - | .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 {
| |
| - | color: #D00000;
| |
| - | 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 ...) */
| |
| - |
| |
| - |
| |
| - |
| |
| - | #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;}
| |
| - |
| |
| - |
| |
| - | #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>
| |
| - |
| |
| - | <div id="top">
| |
| - | <div class="menubar">
| |
| - | <ul>
| |
| - | <li style="width:100px;">Home</li>
| |
| - | <li style="width:100px;">Team
| |
| - | <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">
| |
| - | <ul class="slide-pic">
| |
| - | <li class="cur"><img alt="" src="picture/show1.jpg" /></li>
| |
| - | <li><img alt="" src="picture/show2.jpg" /></li>
| |
| - | <li><img alt="" src="picture/show3.jpg" /></li>
| |
| - | <li><img alt="" src="picture/show4.jPG" /></li>
| |
| - | </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();
| |
| - | }
| |
| - | });
| |
| - | </script>
| |
| - |
| |
| - |
| |
| - | <div id="subject">
| |
| - | <div class="sub sub1">
| |
| - | <img src="hp/sub1.jpg">
| |
| - | <div class="cover co1">
| |
| - | </div>
| |
| - | </div>
| |
| - | <div class="sub sub2">
| |
| - | <img src="hp/sub1.jpg">
| |
| - | <div class="cover co2">
| |
| - | </div>
| |
| - | </div>
| |
| - | <div class="sub sub3">
| |
| - | <img src="hp/sub1.jpg">
| |
| - | <div class="cover co3">
| |
| - | </div>
| |
| - | </div>
| |
| - | <div class="sub sub4">
| |
| - | <img src="hp/sub1.jpg">
| |
| - | <div class="cover co4">
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | <script type="text/javascript">
| |
| - | $(document).ready(function(){
| |
| - | $(".cover").mouseover(function(){
| |
| - | $(this).stop().animate({"marginTop":"0px"},300);
| |
| - | });
| |
| - | $(".cover").mouseout(function(){
| |
| - | $(this).stop().animate({"marginTop":"166px"},300);
| |
| - | });
| |
| - | });
| |
| - | </script>
| |
| - |
| |
| - |
| |
| - |
| |
| - | <div id="footer">
| |
| - | </div>
| |
| - |
| |
| - | </BODY>
| |
| - | </HTML>
| |
There are no pages that link to this file.
"
