|
|
| (156 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| - | <html xmlns="http://www.w3.org/1999/xhtml">
| + | {{Template:Queens_Canada/qgemheader}} |
| - | <head>
| + | |
| - | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
| + | |
| - | <title>Untitled Document</title>
| + | |
| - | <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
| + | |
| - | <script type="text/javascript" src="../../Downloads/jquery-visible-master/jquery.visible.js"></script>
| + | |
| - | <style>
| + | |
| - | *{
| + | |
| - | margin:0;
| + | |
| - | padding:0;
| + | |
| - | }
| + | |
| - | html{
| + | |
| - | white-space:nowrap;
| + | |
| - | word-spacing:0;
| + | |
| - | padding:0;
| + | |
| - | margin:0;
| + | |
| - |
| + | |
| - | }
| + | |
| - | /* ----------------Display:none---------------- */
| + | |
| - | #p-logo {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | | + | |
| - | #search-controls {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | | + | |
| - | .firstHeading {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | | + | |
| - | #catlinks {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | | + | |
| - | #footer-box {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | | + | |
| - | #contentSub {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | /**---------PAGE------------**/
| + | |
| - | #fullpage{
| + | |
| - | color:white;
| + | |
| - | margin:0;
| + | |
| - | padding:0;
| + | |
| - | width:100%;
| + | |
| - | height:100%;
| + | |
| - | position:fixed;
| + | |
| - | }
| + | |
| - | body{
| + | |
| - | background:white;
| + | |
| - | background-siz:cover;
| + | |
| - | z-index:-999;
| + | |
| - | }
| + | |
| - | /**---------HEADER----------**/
| + | |
| - | .actualimg{
| + | |
| - | background:url(https://dl.dropboxusercontent.com/u/125588631/qgem-final-cover.png) no-repeat center center;
| + | |
| - | position:fixed;
| + | |
| - | background-size:cover;
| + | |
| - | padding:0px;
| + | |
| - | margin:0px;
| + | |
| - | min-width:100%;
| + | |
| - | min-height:100%;
| + | |
| - | }
| + | |
| - | .home-body{
| + | |
| - | background:none repeat scroll 0 0 #FBFBFB;
| + | |
| - | clear:both;
| + | |
| - | margin-top:600px;
| + | |
| - | margin-left,margin-right,margin-bottom:0px;
| + | |
| - | padding:0px;
| + | |
| - | height:auto;
| + | |
| - | width:100%;
| + | |
| - | position:relative;
| + | |
| - | display:inline-block;
| + | |
| - | left:0px;
| + | |
| - | right:0px;
| + | |
| - | bottom:0px;
| + | |
| - | z-index:1;
| + | |
| - | position:relative;
| + | |
| - | }
| + | |
| - | .tattletale{
| + | |
| - | height:50px;
| + | |
| - | width:50px;
| + | |
| - | top-margin:10px;
| + | |
| - | left-margin:20px;
| + | |
| - | background:blue;
| + | |
| - | position:relative;
| + | |
| - | z-index:999;
| + | |
| - | display:none;
| + | |
| - | }
| + | |
| - | /**--------General Style Elements------------**/
| + | |
| - | .center-align{
| + | |
| - | text-align:center;
| + | |
| - | }
| + | |
| - | .container{
| + | |
| - | margin:0px;
| + | |
| - | padding:0px;
| + | |
| - | width:100%;
| + | |
| - | z-index:0;
| + | |
| - | position:relative;
| + | |
| - | }
| + | |
| - | /**---------Menubar------------**/
| + | |
| - | .logo-bar{
| + | |
| - | width:100%;
| + | |
| - | height:60px;
| + | |
| - | background-color:#83282a;
| + | |
| - | position:fixed;
| + | |
| - | z-index:50;
| + | |
| - | display:none;
| + | |
| - | margin:0px;
| + | |
| - | padding:0px;
| + | |
| - | top,left,right:0;
| + | |
| - | vertical-align:text-top;
| + | |
| - | float:left;
| + | |
| - | border:0px;;
| + | |
| - | }
| + | |
| - | .upper-row{
| + | |
| - | margin-top:0px;
| + | |
| - | margin-left:55%;
| + | |
| - | overflow:hidden;
| + | |
| - | position:absolute;
| + | |
| - | }
| + | |
| - | .lower-row{
| + | |
| - | margin-top:32px;
| + | |
| - | margin-left:59%;
| + | |
| - | position:absolute;
| + | |
| - | }
| + | |
| - | .top-menu{
| + | |
| - | padding:0px;
| + | |
| - | position:fixed;
| + | |
| - | z-index:100;
| + | |
| - | }
| + | |
| - | .top-menu ul{
| + | |
| - | margin:0;
| + | |
| - | padding:0;
| + | |
| - | }
| + | |
| - | .top-menu li{
| + | |
| - | display:inline-block;
| + | |
| - | padding: 0 10px;
| + | |
| - | margin: 0 0px;
| + | |
| - | }
| + | |
| - | .top-menu a:link {text-decoration:none;color:#83282a;}
| + | |
| - | .top-menu a:visited{color:#83282a;}
| + | |
| - | .top-menu a:hover{color:#ff6669;}
| + | |
| - | | + | |
| - | .top-menu-low{
| + | |
| - | top-margin:20px;
| + | |
| - | padding:0px;
| + | |
| - | position:fixed;
| + | |
| - | z-index:100;
| + | |
| - | }
| + | |
| - | .top-menu-low ul{
| + | |
| - | margin:0;
| + | |
| - | padding:0;
| + | |
| - | }
| + | |
| - | .top-menu-low li{
| + | |
| - | display:inline-block;
| + | |
| - | padding: 0 5px;
| + | |
| - | margin: 0 2px;
| + | |
| - | }
| + | |
| - | .top-menu-low a:link {text-decoration:none;color:#83282a;}
| + | |
| - | .top-menu-low a:visited{color:#83282a;}
| + | |
| - | .top-menu-low a:hover{color:#ff6669;}
| + | |
| - | /**---------Fonts---------**/
| + | |
| - | @font-face{
| + | |
| - | font-family:bebasN;
| + | |
| - | src:url(https://dl.dropboxusercontent.com/u/125588631/BebasNeue.otf);
| + | |
| - | }
| + | |
| - | .menu-font{
| + | |
| - | font-family:bebasN;
| + | |
| - | font-size:2em;
| + | |
| - | }
| + | |
| - | .menu-font-low{
| + | |
| - | font-family:bebasN;
| + | |
| - | font-size:1.5em;
| + | |
| - | }
| + | |
| - | .regular{
| + | |
| - | font-family:bebasN;
| + | |
| - | color:black;
| + | |
| - | font-size:15px;
| + | |
| - | }
| + | |
| - | </style>
| + | |
| - | </head>
| + | |
| - | <body>
| + | |
| - | <p><!--<div id="fullpage"></div>-->
| + | |
| - | </p>
| + | |
| - | <div class="logo-bar"><img src="https://dl.dropboxusercontent.com/u/125588631/toolbar-logo.png" height="60px" /></div>
| + | |
| - | | + | |
| - | <div class="actualimg"><div class="tattletale"></div></div>
| + | |
| - | <div class="top-menu menu-font upper-row">
| + | |
| - | <ul>
| + | |
| - | <li><a href="#">HOME</a></li>
| + | |
| - | <li><a href="https://2013.igem.org/Team:Queens_Canada/Team">TEAM</a></li>
| + | |
| - | <li><a href="https://2013.igem.org/Team:Queens_Canada/Project">PROJECT</a></li>
| + | |
| - | <li><a href="#">OUTREACH</a></li>
| + | |
| - |
| + | |
| - | </ul>
| + | |
| - | </div>
| + | |
| - | <div class="top-menu-low menu-font-low lower-row">
| + | |
| - | <ul>
| + | |
| - | <li><a href="https://2013.igem.org/Team:Queens_Canada/Parts">PARTS</a></li>
| + | |
| - | <li><a href="https://2013.igem.org/Team:Queens_Canada/Safety">SAFETY</a></li>
| + | |
| - | <li><a href="#">JUDGING</a></li>
| + | |
| - | <li><a href="https://2013.igem.org/Team:Queens_Canada/Notebook">NOTEBOOK</a></li>
| + | |
| - | </ul>
| + | |
| - | </div>
| + | |
| - | <div class="home-body">
| + | |
| - | <div class="container center-align regular">
| + | |
| - | ><p>More to come in the near future!</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | <p>This is filler</p><br />
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | | + | |
| - | <script type="text/javascript">
| + | |
| - | | + | |
| - | function isOnScreen(element)
| + | |
| - | {
| + | |
| - | var curPos = element.offset();
| + | |
| - | var curTop = curPos.top;
| + | |
| - | var screenHeight = $(window).height();
| + | |
| - | return (curTop >= screenHeight) ? false : true;
| + | |
| - | } | + | |
| - | | + | |
| - | $(document).ready(function(){
| + | |
| - | $(".logo-bar").fadeOut('fast');
| + | |
| - | var height = $(window).height();
| + | |
| - | var val = (height.toString())+"px";
| + | |
| - | $(".home-body").css("margin-top",val);
| + | |
| - |
| + | |
| - | $(window).resize(function(){
| + | |
| - | var height = $(window).height();
| + | |
| - | var val = (height.toString())+"px";
| + | |
| - | $(".home-body").css("margin-top",val);
| + | |
| - | });
| + | |
| - |
| + | |
| - | $(window).scroll(function(){
| + | |
| - | if(isOnScreen($(".tattletale")) == false){
| + | |
| - | $(".logo-bar").css("display","inline-block");
| + | |
| - | $(".logo-bar").fadeIn('fast');
| + | |
| - | $(".top-menu a:link").css("color","white");
| + | |
| - | $(".top-menu-low a:link").css("color","white");
| + | |
| - | }
| + | |
| - | else{
| + | |
| - | $(".logo-bar").fadeOut('fast');
| + | |
| - | $(".top-menu a:link").css("color","#83282a");
| + | |
| - | $(".top-menu-low a:link").css("color","#83282a");
| + | |
| - |
| + | |
| - | }
| + | |
| - | });
| + | |
| - |
| + | |
| - | /*var icecap = $(window).height();
| + | |
| - | $(window).resize(function(){
| + | |
| - | $(".home-body").css("margin-top",(icecap+"px"));
| + | |
| - | });
| + | |
| - | var p = $("p:first");
| + | |
| - | var offset=p.offset();
| + | |
| - | if(offset<=10){
| + | |
| - | $(".actualimg").fadeTo("fast",0);
| + | |
| - | }*/
| + | |
| - | });
| + | |
| - | </script>
| + | |
| - | | + | |
| - | </body>
| + | |
| - | </html>
| + | |
"
