Team:Queens Canada

From 2013.igem.org

(Difference between revisions)
(Replaced content with "{{Template:Team:Queens_Canada/qgem_header}} <html> </html>")
Line 1: Line 1:
-
{{Template:Team:Queens_Canada/qgem_header}}
+
<html xmlns="http://www.w3.org/1999/xhtml">
-
<html>
+
<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;
 +
}
 +
 
 +
#globalWrapper{
 +
    margin:0;
 +
    padding:0;
 +
}
 +
 
 +
#content{
 +
    margin:0;
 +
    padding:0;
 +
    width:100%;
 +
}
 +
 
 +
#bodyContent{
 +
    margin:0;
 +
    padding:0;
 +
    width:100%;
 +
}
 +
 
 +
/**---------TOP-SECTION----**/
 +
#top-section {
 +
height: 30px;
 +
width: 100%;
 +
background: none repeat scroll 0 0 #343838; /*per Page*/
 +
border-bottom: 1px solid #262B35; /*per Page*/
 +
border-left: medium none;
 +
border-right: medium none;
 +
        margin:0;
 +
        padding:0;
 +
}
 +
 
 +
#menubar {
 +
top: 2px;
 +
font-family: 'Droid Sans', sans-serif;
 +
        margin:0;
 +
        padding:0;
 +
}
 +
/* ----------------TopSection_left-menu---------------- */
 +
.left-menu,.left-menu a {
 +
color: white;
 +
left: 0px;
 +
text-transform: capitalize;
 +
}
 +
 
 +
.left-menu:hover {
 +
background-color: transparent;
 +
}
 +
 
 +
.left-menu:hover a {
 +
color: white;
 +
text-decoration: none !important;
 +
}
 +
 
 +
.left-menu li a:hover {
 +
color: #aaaaff;
 +
}
 +
 
 +
/* ----------------TopSection_right-menu---------------- */
 +
.right-menu li {
 +
background-color: transparent;
 +
}
 +
 
 +
.right-menu,.right-menu a {
 +
color: white;
 +
right: 0;
 +
text-align: right;
 +
}
 +
 
 +
.right-menu:hover {
 +
background-color: transparent;
 +
}
 +
 
 +
.right-menu:hover a {
 +
color: white;
 +
}
 +
 
 +
.right-menu li a {
 +
background-color: transparent;
 +
color: white;
 +
padding: 0 15px 0 0;
 +
}
 +
 
 +
.right-menu li a:hover {
 +
color: #aaaaff;
 +
}
 +
 
 +
/**---------PAGE------------**/
 +
#fullpage{
 +
color:white;
 +
margin:0;
 +
padding:0;
 +
width:100%;
 +
height:100%;
 +
position:fixed;
 +
}
 +
body{
 +
background:white;
 +
background-siz:cover;
 +
z-index:-999;
 +
}
 +
/**---------HEADER----------**/
 +
.top-photo{
 +
        background:url(https://dl.dropboxusercontent.com/u/125588631/qgem-final-cover.png) no-repeat center center;
 +
        position:relative;
 +
        overflow:hidden;
 +
        width:auto;
 +
        padding:0;
 +
        margin:0;
 +
}
 +
.actualimg{
 +
        background:url(https://dl.dropboxusercontent.com/u/125588631/qgem-final-cover.png) no-repeat center center;
 +
        background-size:cover;
 +
        position:absolute;
 +
}
 +
.home-body{
 +
background:none repeat scroll 0 0 #FBFBFB;
 +
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:absolute;
 +
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="top-photo"><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="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;
 +
}
 +
 
 +
function threshold(element)
 +
{
 +
var curPos = element.offset();
 +
var curTop = curPos.top;
 +
var screenHeight = $(window).height();
 +
if (curTop == screenHeight){
 +
if (curTop > screenHeight){ return 1;}
 +
else {return (-1);}
 +
}
 +
return 0;
 +
}
 +
 
 +
$(document).ready(function(){
 +
var height = $(window).height()-30;
 +
        var val = (height.toString())+"px";
 +
$(".top-photo").css("height",val);
 +
 +
$(window).resize(function(){
 +
var height = $(window).height();
 +
var val = (height.toString())+"px";
 +
$(".top-photo").css("height",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").css("display","none");
 +
$(".top-menu a:link").css("color","#83282a");
 +
$(".top-menu-low a:link").css("color","#83282a");
 +
 +
}
 +
});
 +
});
 +
</script>
 +
</body>
</html>
</html>

Revision as of 22:56, 30 May 2013

Untitled Document

>

More to come in the near future!


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler


This is filler