|
|
| Line 1: |
Line 1: |
| - | <html>
| |
| - | <head>
| |
| - | <title> </title>
| |
| | | | |
| - | <style type="text/css">
| |
| - |
| |
| - | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
| |
| - | display:none;}
| |
| - |
| |
| - | #top-section {
| |
| - | width: 965px;
| |
| - | height: 0;
| |
| - | margin: 0 auto;
| |
| - | padding: 0;
| |
| - | border: none;}
| |
| - |
| |
| - |
| |
| - |
| |
| - | #menubar {
| |
| - | font-size: 100%;
| |
| - | top: 0px;}
| |
| - | .left-menu:hover {
| |
| - | background-color: transparent;}
| |
| - | #menubar li a {
| |
| - | background-color: transparent;}
| |
| - | #menubar:hover {
| |
| - | color: white;}
| |
| - | #menubar li a {
| |
| - | color: transparent;}
| |
| - | #menubar:hover li a {
| |
| - | color: white;}
| |
| - | <head>
| |
| - | <head>
| |
| - | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
| |
| - | <title>Home</title>
| |
| - | <style>
| |
| - | body,div,ul,li{margin:0;padding:0;}
| |
| - | body{height:2000px;background:#F0F0F0;}
| |
| - | li{list-style:none;}
| |
| - | a:link,a:visited{outline:none;text-decoration:none;}
| |
| - | #wrap{width:100%;position:fixed;top:0;}
| |
| - | #topBar{
| |
| - | color:#CCC;
| |
| - | height:auto;
| |
| - | background:#06F;
| |
| - | overflow:hidden;
| |
| - | text-align:center;
| |
| - | font-family: Arial;
| |
| - | font-size: 50px;
| |
| - | line-height: 60px;
| |
| - | }
| |
| - | #topBar a{color:#FFF;background:#7A7A7A;padding:2px 5px;border-radius:10px;}
| |
| - | #nav{height:50px;overflow:hidden;border-top:1px solid #999;border-bottom::1px solid #666;background:#000 url(http://www.alixixi.com/web/UploadPic/2011-12/2011122131216590.png) repeat-x;}
| |
| - | #nav .logo{float:left;margin:0 20px;}
| |
| - | #nav .logo a{float:left;width:100px;height:50px;overflow:hidden;text-indent:-9999px;background:url(http://farm1.static.flickr.com/84/248311926_cefff0d5c1.jpg) no-repeat;}
| |
| - | #nav .logo a:hover{background-position:0 -50px;}
| |
| - | #nav.hide .logo a{width:100px;height:30px;background-position:0 -100px;_background-position:0 -130px;}
| |
| - | #nav.hide .logo a:hover{background-position:0 -130px;}
| |
| - | #nav ul,#nav ul li{float:left;}
| |
| - | #nav ul li a{float:left;color:#CCC;height:50px;font:16px/50px Arial;padding:0 20px;}
| |
| - | #nav ul li a:hover{color:#FFF;background:url(http://www.alixixi.com/web/UploadPic/2011-12/2011122131216590.png) 0 -50px repeat-x;}
| |
| - | #nav.hide ul{display:none;}
| |
| - | </style>
| |
| - | <script>
| |
| - | var fgm = {
| |
| - | shit: !-[1,] && !window.XMLHttpRequest,
| |
| - | scrollTop: function() {
| |
| - | return document.documentElement.scrollTop || document.body.scrollTop;
| |
| - | },
| |
| - | currentStyle: function(obj, attr) {
| |
| - | return parseInt(obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj, null)[attr]);
| |
| - | },
| |
| - | fixed: function(element) {
| |
| - | if(this.shit) {
| |
| - | var top = this.currentStyle(element, "top") || 0,
| |
| - | dd = "(document.documentElement)";
| |
| - | document.documentElement.style.textOverflow = "ellipsis";
| |
| - | element.style.position = "absolute";
| |
| - | element.style.setExpression("top", "eval(" + dd + ".scrollTop + " + (top - this.scrollTop()) + ') + "px"');
| |
| - | }
| |
| - | else {
| |
| - | element.style.position = "fixed";
| |
| - | }
| |
| - | },
| |
| - | doMove: function(obj, iTarget, callback) {
| |
| - | clearInterval(obj.timer);
| |
| - | obj.timer = setInterval(function() {
| |
| - | var iCur = fgm.currentStyle(obj, "height"),
| |
| - | iSpeed = (iTarget - iCur) / 5;
| |
| - | iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
| |
| - | iTarget == iCur ? (clearInterval(obj.timer), callback && callback.call(obj)) : obj.style.height = iSpeed + iCur + "px";
| |
| - | }, 30);
| |
| - | }
| |
| - | };
| |
| - | window.onload = function() {
| |
| - | var oWrap = document.getElementById("wrap"),
| |
| - | oTopBar = document.getElementById("topBar"),
| |
| - | oNav = document.getElementById("nav"),
| |
| - | fnStatus = function(status) {
| |
| - | !!status ?
| |
| - | (function() {
| |
| - | oNav.className = "hide";
| |
| - | fgm.doMove(oTopBar, 0);
| |
| - | fgm.doMove(oNav, 30);
| |
| - | })() :
| |
| - | (function() {
| |
| - | fgm.doMove(oTopBar, 60);
| |
| - | fgm.doMove(oNav, 50, function() {
| |
| - | this.className = "" ;
| |
| - | })
| |
| - | })();
| |
| - | };
| |
| - | fgm.fixed(oWrap);//IE6 Fixed
| |
| - | window.onscroll = function() {
| |
| - | var iScrollTop = fgm.scrollTop();
| |
| - | fnStatus(iScrollTop > 0);
| |
| - | document.onmouseover = function(ev) {
| |
| - | var oEv = ev || event,
| |
| - | oTarget = oEv.target || oEv.srcElement,
| |
| - | contains = function() {
| |
| - | if(oWrap.contains) {
| |
| - | return oWrap.contains(oTarget);
| |
| - | }
| |
| - | else if(oWrap.compareDocumentPosition) {
| |
| - | return !!(oWrap.compareDocumentPosition(oTarget) & 16);
| |
| - | }
| |
| - | }();
| |
| - | fnStatus(!contains && iScrollTop > 0);
| |
| - | };
| |
| - | };
| |
| - | window.onscroll();
| |
| - | };
| |
| - | </script>
| |
| - | </head>
| |
| - | <body>
| |
| - | <div id="wrap">
| |
| - | <div id="topBar">
| |
| - | 2013 BHSF iGem
| |
| - | </div>
| |
| - | <!--/topBar-->
| |
| - | <div id="nav">
| |
| - | <div class="logo"><a href="javascript:;">2013 BHSF iGem</a></div>
| |
| - | <ul>
| |
| - | <li><a href="javascript:;">Home</a></li>
| |
| - | <li><a href="javascript:;">Ideas</a></li>
| |
| - | <li><a href="javascript:;">Members</a></li>
| |
| - | <li><a href="javascript:;">Photo</a></li>
| |
| - | <li><a href="javascript:;">About</a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | <!--/nav-->
| |
| - | </div>
| |
| - | <!--/wrap-->
| |
| - | </body>
| |
| - | </html>
| |
"
