Template:Queens Canada/Notebook
From 2012.igem.org
(Difference between revisions)
(109 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
+ | {{Template:Queens_Canada/Headernojs}} | ||
<html> | <html> | ||
<head> | <head> | ||
- | + | ||
- | <script | + | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> |
- | <script src=" | + | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/Smoothscroll?action=raw&ctype=text/js"> </script> |
- | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/ | + | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/easing?action=raw&ctype=text/js"> </script> |
- | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/ | + | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/Init?action=raw&ctype=text/js"> |
- | /js"></script> | + | |
- | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/jquerykwicks?action=raw&ctype=text/js"></script> | + | |
+ | </script> | ||
+ | |||
+ | <script type="text/javascript" src="https://2012.igem.org/Team:Queens_Canada/Javascript/jquerykwicks?action=raw&ctype=text/js"></script> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
- | + | $().ready(function() { | |
$('.kwicks').kwicks({ | $('.kwicks').kwicks({ | ||
- | max : | + | max : 650, |
- | duration: | + | duration: 1000, |
easing: 'easeOutQuint' | easing: 'easeOutQuint' | ||
}); | }); | ||
- | + | }); | |
+ | |||
</script> | </script> | ||
- | |||
- | |||
<style type="text/css"> | <style type="text/css"> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
#NotebookNav | #NotebookNav | ||
Line 69: | Line 37: | ||
background-color: white; | background-color: white; | ||
padding: 15px 15px 15px 15px; | padding: 15px 15px 15px 15px; | ||
- | width: | + | width: 970px; |
background-color: transparent; | background-color: transparent; | ||
border:none; | border:none; | ||
Line 112: | Line 80: | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
#teamtable | #teamtable | ||
{ | { | ||
- | font-family:" | + | font-family:"Trebuchet MS", Helvetica, sans-serif; |
font-size:12px; | font-size:12px; | ||
text-align: center; | text-align: center; | ||
Line 307: | Line 103: | ||
font-size:20px; | font-size:20px; | ||
color:gray; | color:gray; | ||
+ | } | ||
+ | .kwicks_container | ||
+ | { | ||
+ | width: 1000px; | ||
+ | margin-left: 2.5px; | ||
+ | margin-right: 2.5px; | ||
} | } | ||
.kwicks { | .kwicks { | ||
Line 313: | Line 115: | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
- | width: | + | width:100%; |
height:50px; | height:50px; | ||
z-index:2; | z-index:2; | ||
+ | border-width: 10; | ||
+ | -khtml-border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
} | } | ||
.kwicks li { | .kwicks li { | ||
Line 323: | Line 129: | ||
padding: 0; | padding: 0; | ||
cursor: pointer; | cursor: pointer; | ||
- | width: | + | width: 500px; |
height: 35px; | height: 35px; | ||
z-index:2; | z-index:2; | ||
cursor:pointer; | cursor:pointer; | ||
- | border-left-width: | + | border-left-width: 2.5px; |
border-left-style: solid; | border-left-style: solid; | ||
- | border-left-color: | + | border-left-color: transparent; |
+ | border-right-color: transparent; | ||
+ | border-right-width: 2.5px; | ||
+ | |||
} | } | ||
.kwicks li a { | .kwicks li a { | ||
Line 335: | Line 144: | ||
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
font-family: "Lucida Grande", "Lucida Sans Unicode", Arial; | font-family: "Lucida Grande", "Lucida Sans Unicode", Arial; | ||
- | font-size: | + | font-size: 1.5em; |
letter-spacing: -0.07em; | letter-spacing: -0.07em; | ||
- | color: # | + | color: #ffffff; |
height: 40px; | height: 40px; | ||
outline:none; | outline:none; | ||
Line 345: | Line 154: | ||
text-transform: uppercase; | text-transform: uppercase; | ||
font-weight: bold; | font-weight: bold; | ||
- | + | line-height: 37px; | |
margin-left: 5px; | margin-left: 5px; | ||
text-decoration: none; | text-decoration: none; | ||
+ | vertical-align: middle; | ||
} | } | ||
.kwicks li h3 { | .kwicks li h3 { | ||
Line 364: | Line 174: | ||
text-decoration: none; | text-decoration: none; | ||
left: 0px; | left: 0px; | ||
- | top: | + | top: 5px; |
right: 0px; | right: 0px; | ||
bottom: 0px; | bottom: 0px; | ||
} | } | ||
#kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7 { | #kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7 { | ||
- | + | ||
overflow: hidden; | overflow: hidden; | ||
- | position: | + | position: relative; |
- | display: | + | display: inline; |
- | width: | + | width: 50%; |
+ | |||
} | } | ||
#kwick_1 { | #kwick_1 { | ||
left: 0px; | left: 0px; | ||
- | border: | + | border-width: 0px 0px 0px 0px; |
+ | border-right-color: black; | ||
+ | width: 498px; | ||
+ | background-color: crimson; | ||
+ | |||
+ | -webkit-border-radius: 10px; | ||
+ | -khtml-border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
} | } | ||
#kwick_2 { | #kwick_2 { | ||
- | + | ||
+ | background-color: coral; | ||
+ | width: 498px; | ||
+ | border-right-width:2.5px; | ||
+ | -webkit-border-radius: 10px; | ||
+ | -khtml-border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
} | } | ||
- | # | + | |
- | + | #kwick_1 li a { | |
+ | background-position:0px 0px; | ||
+ | border-width: 0px 0px 0px 0px; | ||
+ | border-right-color: | ||
} | } | ||
- | + | ||
- | + | #kwick_1 li a:hover { | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | #kwick_1 a { | + | |
background-position:0px 0px; | background-position:0px 0px; | ||
+ | border-width: 0px 0px 0px 0px; | ||
+ | border-right-color: black; | ||
} | } | ||
+ | #kwick_2 li a, a:hover, a:active | ||
+ | { | ||
+ | border-left-color: black; | ||
+ | } | ||
+ | |||
.kwicks a:hover, .kwicks #active { | .kwicks a:hover, .kwicks #active { | ||
- | color: # | + | color: #ffffff; |
} | } | ||
.kwicks li a:hover h3, .kwicks li #active h3 { | .kwicks li a:hover h3, .kwicks li #active h3 { | ||
Line 423: | Line 248: | ||
#kwick_7 a { | #kwick_7 a { | ||
background-position:0px -300px; | background-position:0px -300px; | ||
+ | } | ||
+ | p fade1 { position:inline; } | ||
+ | ul fade2 { position:inline; | ||
+ | font-size:36px; text-align:center; | ||
+ | color:yellow; background:red; | ||
+ | padding-top:25px; | ||
+ | top:0; left:0; display:none; } | ||
+ | span { display:none; } | ||
+ | #notebook | ||
+ | { | ||
+ | border-width: 10px; | ||
+ | border-color: black; | ||
} | } | ||
- | + | #labcontent | |
+ | { | ||
+ | -khtml-border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | border-radius: 10px; | ||
+ | -moz-box-shadow: 3px 3px 4px #000; | ||
+ | -webkit-box-shadow: 3px 3px 4px #000; | ||
+ | box-shadow: 3px 3px 4px #000; | ||
+ | margin-bottom: 10px; | ||
+ | background-color: white; | ||
+ | margin-top: 125px; | ||
+ | width: 1000px; | ||
+ | height: auto; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
- | + | #labcontent h1, h2, h3, h4, h5 | |
- | + | { | |
- | + | padding-top: 0px; | |
- | + | padding-bottom:0px; | |
- | + | padding-left: 10px; | |
- | + | padding-right: 10px; | |
- | + | margin-top:0px; | |
- | + | margin-bottom: 0px; | |
- | + | font-family: "Trebuchet MS", Helvetica, sans-serif; | |
- | + | line-height: normal; | |
- | + | } | |
- | + | #notebookcontent h1 | |
+ | { | ||
+ | font-size: 2em; | ||
+ | color:grey; | ||
+ | padding-top: 5px; | ||
+ | } | ||
+ | #notebookcontent h2 | ||
+ | { | ||
+ | font-size: 1.1em; | ||
+ | color:black; | ||
+ | } | ||
+ | #protocolcontent | ||
+ | { | ||
+ | display:none; | ||
+ | } | ||
+ | #NotebookTitle | ||
+ | { | ||
+ | background-color: MediumTurquoise; | ||
+ | -webkit-border-radius: 10px 10px 0px 0px ; | ||
+ | -khtml-border-radius: 10px 10px 0px 0px ; | ||
+ | -moz-border-radius: 10px 10px 0px 0px ; | ||
+ | border-radius: 10px 10px 0px 0px ; | ||
+ | padding-left: 10px; | ||
+ | margin-bottom: 0px; | ||
+ | border-bottom: 0px; | ||
+ | margin-top: -212px; | ||
+ | } | ||
- | </ | + | #NotebookTitle p |
- | + | { | |
- | <div id=" | + | color:white; |
- | + | font-size: 2em; | |
+ | font-family: "Trebuchet MS", Helvetica, sans-serif; | ||
+ | text-decoration: bold; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <!-- | ||
+ | <div id="pagecontent"> | ||
<div id="NotebookNav" > | <div id="NotebookNav" > | ||
<div class="menu"> | <div class="menu"> | ||
Line 469: | Line 355: | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
+ | </div> | ||
+ | <script type="text/javascript"> | ||
+ | var maxHeight = ("#notebookcontent").height(); | ||
+ | |||
+ | $("#procotolcontent").css("height", maxHeight); | ||
+ | |||
+ | |||
+ | |||
+ | </script> | ||
+ | --> | ||
+ | </body> | ||
</html> | </html> |
Latest revision as of 05:59, 16 August 2012
Control