|
|
| (141 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| | <html> | | <html> |
| | <head> | | <head> |
| - | <link href='http://fonts.googleapis.com/css?family=Audiowide|Share+Tech+Mono' rel='stylesheet' type='text/css'>
| |
| - | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
| |
| - | </head>
| |
| | | | |
| - | <style> | + | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> |
| | | | |
| - | /* Hide Defaults */ | + | <script type="text/javascript"> |
| - | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
| + | |
| - | display:none;}
| + | |
| - | #top-section {
| + | |
| - | border: none;
| + | |
| - | height: 0px;}
| + | |
| - | #content {
| + | |
| - | border: none;}
| + | |
| | | | |
| - | /* Background */
| + | $(document).ready(function(){ |
| - | body {
| + | |
| - | background-image:url("http://oi62.tinypic.com/2uek64o.jpg");
| + | |
| - | }
| + | |
| - | div#bodyContent {
| + | |
| - | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| + | |
| - | }
| + | |
| - | div#content{
| + | |
| - | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| + | |
| - | }
| + | |
| - | div#menubar {
| + | |
| - | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| + | |
| - | }
| + | |
| | | | |
| - | /* Text Styles */ | + | // PLEASE READ BELOW COMMENT |
| - | h1{
| + | // |
| - | font: 400 45px/0.5 'Audiowide', Helvetica, sans-serif;
| + | // don't worry, we're open source --> https://github.com/raptor-igem/2014hs-website |
| - | text-align:center;
| + | // |
| - | border-bottom: medium none !important;
| + | // PLEASE READ ABOVE COMMENT |
| - | }
| + | |
| - | p{
| + | $("body.page-Team_Ravenwood_Raptors").append("<iframe class='real' src='http://raptor-igem.github.io/2014hs-website/'></iframe>"); |
| - | font: 400 14px/1.5 'Share Tech Mono', Times, serif;
| + | }); |
| - | } | + | |
| | | | |
| - | /* Navigation */ | + | </script> |
| - | #cssmenu {
| + | |
| - | position: relative;
| + | <style type="text/css"> |
| - | height: 44px;
| + | body { |
| - | background: #e6e6e6;
| + | overflow-x: hidden; |
| - | width: auto;
| + | height: 100%; |
| - | }
| + | } |
| - | #cssmenu ul {
| + | .real { |
| - | list-style: none;
| + | |
| - | padding: 0;
| + | |
| - | margin: 0;
| + | |
| - | line-height: 1;
| + | |
| - | }
| + | |
| - | #cssmenu > ul {
| + | |
| - | position: relative;
| + | |
| - | display: block;
| + | |
| - | background: #e6e6e6;
| + | |
| - | height: 32px;
| + | |
| - | width: 100%;
| + | |
| - | z-index: 500;
| + | |
| - | }
| + | |
| - | #cssmenu > ul > li {
| + | |
| - | display: block;
| + | |
| - | position: relative;
| + | |
| - | float: left;
| + | |
| - | margin: 0;
| + | |
| - | padding: 0;
| + | |
| - | }
| + | |
| - | #cssmenu > ul > #menu-button {
| + | |
| - | display: none;
| + | |
| - | }
| + | |
| - | #cssmenu ul li a {
| + | |
| - | display: block;
| + | |
| - | font-family: Helvetica, sans-serif;
| + | |
| - | text-decoration: none;
| + | |
| - | }
| + | |
| - | #cssmenu > ul > li > a {
| + | |
| - | font-size: 14px;
| + | |
| - | font-weight: bold;
| + | |
| - | padding: 15px 20px;
| + | |
| - | color: #7a8189;
| + | |
| - | text-transform: uppercase;
| + | |
| - | -webkit-transition: color 0.25s ease-out;
| + | |
| - | -moz-transition: color 0.25s ease-out;
| + | |
| - | -ms-transition: color 0.25s ease-out;
| + | |
| - | -o-transition: color 0.25s ease-out;
| + | |
| - | transition: color 0.25s ease-out;
| + | |
| - | }
| + | |
| - | #cssmenu > ul > li.has-sub > a {
| + | |
| - | padding-right: 32px; | + | |
| - | }
| + | |
| - | #cssmenu > ul > li:hover > a {
| + | |
| - | color: #9c9c9c;
| + | |
| - | }
| + | |
| - | #cssmenu li.has-sub::after {
| + | |
| - | display: block;
| + | |
| - | content: '';
| + | |
| - | position: absolute;
| + | |
| - | width: 0;
| + | |
| - | height: 0; | + | |
| - | } | + | |
| - | #cssmenu > ul > li.has-sub::after {
| + | |
| - | right: 10px;
| + | |
| - | top: 20px;
| + | |
| - | border: 5px solid transparent;
| + | |
| - | border-top-color: #7a8189;
| + | |
| - | }
| + | |
| - | #cssmenu > ul > li:hover::after {
| + | |
| - | border-top-color: #9c9c9c;
| + | |
| - | }
| + | |
| - | #indicatorContainer {
| + | |
| | position: absolute; | | position: absolute; |
| - | height: 12px;
| |
| | width: 100%; | | width: 100%; |
| - | bottom: 0px; | + | height: 99%; |
| | + | background-color: white; |
| | + | top: 0%; |
| | + | left: 0%; |
| | overflow: hidden; | | overflow: hidden; |
| - | z-index: -1; | + | z-index: 999; |
| | } | | } |
| - | #pIndicator {
| |
| - | position: absolute;
| |
| - | height: 0;
| |
| - | width: 100%;
| |
| - | border: 12px solid transparent;
| |
| - | border-top-color: #2b2f3a;
| |
| - | z-index: -2;
| |
| - | -webkit-transition: left .25s ease;
| |
| - | -moz-transition: left .25s ease;
| |
| - | -ms-transition: left .25s ease;
| |
| - | -o-transition: left .25s ease;
| |
| - | transition: left .25s ease;
| |
| - | }
| |
| - | #cIndicator {
| |
| - | position: absolute;
| |
| - | height: 0;
| |
| - | width: 100%;
| |
| - | border: 12px solid transparent;
| |
| - | border-top-color: #2b2f3a;
| |
| - | top: -12px;
| |
| - | right: 100%;
| |
| - | z-index: -2;
| |
| - | }
| |
| - | #cssmenu ul ul {
| |
| - | position: absolute;
| |
| - | left: -9999px;
| |
| - | top: 70px;
| |
| - | opacity: 0;
| |
| - | -webkit-transition: opacity .3s ease, top .25s ease;
| |
| - | -moz-transition: opacity .3s ease, top .25s ease;
| |
| - | -ms-transition: opacity .3s ease, top .25s ease;
| |
| - | -o-transition: opacity .3s ease, top .25s ease;
| |
| - | transition: opacity .3s ease, top .25s ease;
| |
| - | z-index: 1000;
| |
| - | }
| |
| - | #cssmenu ul ul ul {
| |
| - | top: 37px;
| |
| - | padding-left: 5px;
| |
| - | }
| |
| - | #cssmenu ul ul li {
| |
| - | position: relative;
| |
| - | }
| |
| - | #cssmenu > ul > li:hover > ul {
| |
| - | left: auto;
| |
| - | top: 44px;
| |
| - | opacity: 1;
| |
| - | }
| |
| - | #cssmenu ul ul li:hover > ul {
| |
| - | left: 170px;
| |
| - | top: 0;
| |
| - | opacity: 1;
| |
| - | }
| |
| - | #cssmenu ul ul li a {
| |
| - | width: 130px;
| |
| - | border-bottom: 1px solid #eee;
| |
| - | padding: 10px 20px;
| |
| - | font-size: 12px;
| |
| - | color: #9ea2a5;
| |
| - | background: #fff;
| |
| - | -webkit-transition: all .35s ease;
| |
| - | -moz-transition: all .35s ease;
| |
| - | -ms-transition: all .35s ease;
| |
| - | -o-transition: all .35s ease;
| |
| - | transition: all .35s ease;
| |
| - | }
| |
| - | #cssmenu ul ul li:hover > a {
| |
| - | background: #f6f6f6;
| |
| - | color: #8c9195;
| |
| - | }
| |
| - | #cssmenu ul ul li:last-child > a,
| |
| - | #cssmenu ul ul li.last > a {
| |
| - | border-bottom: 0;
| |
| - | }
| |
| - | .submenuArrow {
| |
| - | border: 6px solid transparent;
| |
| - | width: 0;
| |
| - | height: 0;
| |
| - | border-bottom-color: #fff;
| |
| - | position: absolute;
| |
| - | top: -12px;
| |
| - | }
| |
| - | #cssmenu ul ul li.has-sub::after {
| |
| - | border: 4px solid transparent;
| |
| - | border-left-color: #9ea2a5;
| |
| - | right: 10px;
| |
| - | top: 12px;
| |
| - | -moz-transition: all .2s ease;
| |
| - | -ms-transition: all .2s ease;
| |
| - | -o-transition: all .2s ease;
| |
| - | transition: all .2s ease;
| |
| - | -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
| |
| - | }
| |
| - | #cssmenu ul ul li.has-sub:hover::after {
| |
| - | border-left-color: #fff;
| |
| - | right: -5px;
| |
| - | -webkit-transform: rotateY(180deg);
| |
| - | -ms-transform: rotateY(180deg);
| |
| - | -moz-transform: rotateY(180deg);
| |
| - | -o-transform: rotateY(180deg);
| |
| - | transform: rotateY(180deg);
| |
| - | }
| |
| - | @media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
| |
| - | #cssmenu {
| |
| - | width: auto;
| |
| - | }
| |
| - | #cssmenu ul {
| |
| - | width: auto;
| |
| - | }
| |
| - | #cssmenu .submenuArrow,
| |
| - | #cssmenu #indicatorContainer {
| |
| - | display: none;
| |
| - | }
| |
| - | #cssmenu > ul {
| |
| - | height: auto;
| |
| - | display: block;
| |
| - | }
| |
| - | #cssmenu > ul > li {
| |
| - | float: none;
| |
| - | }
| |
| - | #cssmenu li,
| |
| - | #cssmenu > ul > li {
| |
| - | display: none;
| |
| - | }
| |
| - | #cssmenu ul ul,
| |
| - | #cssmenu ul ul ul,
| |
| - | #cssmenu ul > li:hover > ul,
| |
| - | #cssmenu ul ul > li:hover > ul {
| |
| - | position: relative;
| |
| - | left: auto;
| |
| - | top: auto;
| |
| - | topacity: 1;
| |
| - | padding-left: 0;
| |
| - | }
| |
| - | #cssmenu ul .has-sub::after {
| |
| - | display: none;
| |
| - | }
| |
| - | #cssmenu ul li a {
| |
| - | padding: 12px 20px;
| |
| - | }
| |
| - | #cssmenu ul ul li a {
| |
| - | border: 0;
| |
| - | background: none;
| |
| - | width: auto;
| |
| - | padding: 8px 35px;
| |
| - | }
| |
| - | #cssmenu ul ul li:hover > a {
| |
| - | background: none;
| |
| - | color: #8c9195;
| |
| - | }
| |
| - | #cssmenu ul ul ul a {
| |
| - | padding: 8px 50px;
| |
| - | }
| |
| - | #cssmenu ul ul ul ul a {
| |
| - | padding: 8px 65px;
| |
| - | }
| |
| - | #cssmenu ul ul ul ul ul a {
| |
| - | padding: 8px 80px;
| |
| - | }
| |
| - | #cssmenu ul ul ul ul ul ul a {
| |
| - | padding: 8px 95px;
| |
| - | }
| |
| - | #cssmenu > ul > #menu-button {
| |
| - | display: block;
| |
| - | cursor: pointer;
| |
| - | }
| |
| - | #cssmenu #menu-button > a {
| |
| - | padding: 14px 20px;
| |
| - | }
| |
| - | #cssmenu ul.open li,
| |
| - | #cssmenu > ul.open > li {
| |
| - | display: block;
| |
| - | }
| |
| - | #cssmenu > ul.open > li#menu-button > a {
| |
| - | color: #fff;
| |
| - | border-bottom: 1px solid rgba(150, 150, 150, 0.1);
| |
| - | }
| |
| - | #cssmenu #menu-button::after {
| |
| - | display: block;
| |
| - | content: '';
| |
| - | position: absolute;
| |
| - | height: 3px;
| |
| - | width: 22px;
| |
| - | border-top: 2px solid #7a8189;
| |
| - | border-bottom: 2px solid #7a8189;
| |
| - | right: 20px;
| |
| - | top: 15px;
| |
| - | }
| |
| - | #cssmenu #menu-button::before {
| |
| - | display: block;
| |
| - | content: '';
| |
| - | position: absolute;
| |
| - | height: 3px;
| |
| - | width: 22px;
| |
| - | border-top: 2px solid #7a8189;
| |
| - | right: 20px;
| |
| - | top: 25px;
| |
| - | }
| |
| - | #cssmenu ul.open #menu-button::after,
| |
| - | #cssmenu ul.open #menu-button::before {
| |
| - | border-color: #fff;
| |
| - | }
| |
| - | }
| |
| - | #cssmenu {
| |
| - | padding-left: 200px !important;
| |
| - | }
| |
| - |
| |
| - | /* Slider */
| |
| - | #slider {
| |
| - | text-align: center;
| |
| - | }
| |
| - | input {
| |
| - | display: none;
| |
| - | }
| |
| - | #slide1:checked ~ #slides .inner { margin-left:0; }
| |
| - | #slide2:checked ~ #slides .inner { margin-left:-100%; }
| |
| - | #slide3:checked ~ #slides .inner { margin-left:-200%; }
| |
| - | #slide4:checked ~ #slides .inner { margin-left:-300%; }
| |
| - | #slide5:checked ~ #slides .inner { margin-left:-400%; }
| |
| - | #overflow {
| |
| - | width: 100%;
| |
| - | overflow: hidden;
| |
| - | }
| |
| - | article img {
| |
| - | width: 100%;
| |
| - | }
| |
| - | #slides .inner {
| |
| - | width: 500%;
| |
| - | line-height: 0;
| |
| - | }
| |
| - | #slides article {
| |
| - | width: 20%;
| |
| - | float: left;
| |
| - | }
| |
| - | #controls {
| |
| - | margin: -25% 0 0 0;
| |
| - | width: 100%;
| |
| - | height: 50px;
| |
| - | }
| |
| - | #controls label {
| |
| - | display: none;
| |
| - | width: 50px;
| |
| - | height: 50px;
| |
| - | opacity: 0.3;
| |
| - | }
| |
| - | #active {
| |
| - | margin: 23% 0 0;
| |
| - | text-align: center;
| |
| - | }
| |
| - | #active label {
| |
| - | -webkit-border-radius: 5px;
| |
| - | -moz-border-radius: 5px;
| |
| - | border-radius: 5px;
| |
| - | display: inline-block;
| |
| - | width: 10px;
| |
| - | height: 10px;
| |
| - | background: #bbb;
| |
| - | }
| |
| - | #active label:hover {
| |
| - | background: #ccc;
| |
| - | border-color: #777 !important;
| |
| - | }
| |
| - | #controls label:hover {
| |
| - | opacity: 0.8;
| |
| - | }
| |
| - | #slide1:checked ~ #controls label:nth-child(2),
| |
| - | #slide2:checked ~ #controls label:nth-child(3),
| |
| - | #slide3:checked ~ #controls label:nth-child(4),
| |
| - | #slide4:checked ~ #controls label:nth-child(5),
| |
| - | #slide5:checked ~ #controls label:nth-child(1) {
| |
| - | background: url('next.png') no-repeat;
| |
| - | float: right;
| |
| - | margin: 0 -70px 0 0;
| |
| - | display: block;
| |
| - | }
| |
| - | #slide1:checked ~ #controls label:nth-child(5),
| |
| - | #slide2:checked ~ #controls label:nth-child(1),
| |
| - | #slide3:checked ~ #controls label:nth-child(2),
| |
| - | #slide4:checked ~ #controls label:nth-child(3),
| |
| - | #slide5:checked ~ #controls label:nth-child(4) {
| |
| - | background: url('prev.png') no-repeat;
| |
| - | float: left;
| |
| - | margin: 0 0 0 -70px;
| |
| - | display: block;
| |
| - | }
| |
| - | #slide1:checked ~ #active label:nth-child(1),
| |
| - | #slide2:checked ~ #active label:nth-child(2),
| |
| - | #slide3:checked ~ #active label:nth-child(3),
| |
| - | #slide4:checked ~ #active label:nth-child(4),
| |
| - | #slide5:checked ~ #active label:nth-child(5) {
| |
| - | background: #333;
| |
| - | border-color: #333 !important;
| |
| - | }
| |
| - | .info {
| |
| - | line-height: 20px;
| |
| - | margin: 0 0 -150%;
| |
| - | position: absolute;
| |
| - | font-style: italic;
| |
| - | padding: 30px 30px;
| |
| - | opacity: 0;
| |
| - | color: #000;
| |
| - | text-align: left;
| |
| - | }
| |
| - | .info h3 {
| |
| - | color: #333;
| |
| - | margin: 0 0 5px;
| |
| - | font-weight: normal;
| |
| - | font-size: 22px;
| |
| - | font-style: normal;
| |
| - | }
| |
| - | #slides {
| |
| - | margin: 45px 0 0;
| |
| - | -webkit-border-radius: 5px;
| |
| - | -moz-border-radius: 5px;
| |
| - | border-radius: 5px;
| |
| - | box-shadow: 1px 1px 4px #666;
| |
| - | padding: 1%;
| |
| - | background: #fff;
| |
| - | background: rgb(252,255,244); /* Old browsers */
| |
| - | background: -moz-linear-gradient(top, rgba(252,255,244,1) 0%, rgba(219,218,201,1) 100%); /* FF3.6+ */
| |
| - | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,255,244,1)), color-stop(100%,rgba(219,218,201,1))); /* Chrome,Safari4+ */
| |
| - | background: -webkit-linear-gradient(top, rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Chrome10+,Safari5.1+ */
| |
| - | background: -o-linear-gradient(top, rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Opera 11.10+ */
| |
| - | background: -ms-linear-gradient(top, rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* IE10+ */
| |
| - | background: linear-gradient(top, rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* W3C */
| |
| - | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#dbdac9',GradientType=0 ); /* IE6-9 */
| |
| - | }
| |
| - | #slides .inner {
| |
| - | -webkit-transform: translateZ(0);
| |
| - | -webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
| |
| - | -webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
| |
| - | transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
| |
| - | }
| |
| - | #slider {
| |
| - | -webkit-transform: translateZ(0);
| |
| - | -webkit-transition: all 0.5s ease-out;
| |
| - | -moz-transition: all 0.5s ease-out;
| |
| - | -o-transition: all 0.5s ease-out;
| |
| - | transition: all 0.5s ease-out;
| |
| - | }
| |
| - | #controls label{
| |
| - | -webkit-transform: translateZ(0);
| |
| - | -webkit-transition: opacity 0.2s ease-out;
| |
| - | -moz-transition: opacity 0.2s ease-out;
| |
| - | -o-transition: opacity 0.2s ease-out;
| |
| - | transition: opacity 0.2s ease-out;
| |
| - | }
| |
| - | #slide1:checked ~ #slides article:nth-child(1) .info,
| |
| - | #slide2:checked ~ #slides article:nth-child(2) .info,
| |
| - | #slide3:checked ~ #slides article:nth-child(3) .info,
| |
| - | #slide4:checked ~ #slides article:nth-child(4) .info,
| |
| - | #slide5:checked ~ #slides article:nth-child(5) .info {
| |
| - | opacity: 1;
| |
| - | -webkit-transition: all 1s ease-out 0.6s;
| |
| - | -moz-transition: all 1s ease-out 0.6s;
| |
| - | -o-transition: all 1s ease-out 0.6s;
| |
| - | transition: all 1s ease-out 0.6s;
| |
| - | }
| |
| - | .info, #controls, #slides, #active, #active label, .info h3, .desktop, .tablet, .mobile {
| |
| - | -webkit-transform: translateZ(0);
| |
| - | -webkit-transition: all 0.5s ease-out;
| |
| - | -moz-transition: all 0.5s ease-out;
| |
| - | -o-transition: all 0.5s ease-out;
| |
| - | transition: all 0.5s ease-out;
| |
| - | }
| |
| - |
| |
| | </style> | | </style> |
| | | | |
| | + | </head> |
| | <body> | | <body> |
| | | | |
| - | <!-- jQuery -->
| + | <div id="page-contain"> |
| - | <script>
| + | <div class=" page- real- main"> |
| - | $('#cssmenu').prepend('<div id=" indicatorContainer"><div id="pIndicator"><div id="cIndicator"></div></div></div>'); | + | </div> |
| - | var activeElement = $('#cssmenu>ul>li:first');
| + | |
| - | $('#cssmenu>ul>li').each(function() {
| + | |
| - | if ($(this).hasClass('active')) {
| + | |
| - | activeElement = $(this);
| + | |
| - | }
| + | |
| - | });
| + | |
| - | var posLeft = activeElement.position().left;
| + | |
| - | var elementWidth = activeElement.width();
| + | |
| - | posLeft = posLeft + elementWidth/2 -6;
| + | |
| - | if (activeElement.hasClass('has-sub')) {
| + | |
| - | posLeft -= 6;
| + | |
| - | }
| + | |
| - | $('#cssmenu #pIndicator').css('left', posLeft);
| + | |
| - | var element, leftPos, indicator = $('#cssmenu pIndicator');
| + | |
| - | $("#cssmenu>ul>li").hover(function() {
| + | |
| - | element = $(this);
| + | |
| - | var w = element.width();
| + | |
| - | if ($(this).hasClass('has-sub'))
| + | |
| - | {
| + | |
| - | leftPos = element.position().left + w/2 - 12;
| + | |
| - | }
| + | |
| - | else {
| + | |
| - | leftPos = element.position().left + w/2 - 6;
| + | |
| - | }
| + | |
| - | $('#cssmenu #pIndicator').css('left', leftPos);
| + | |
| - | }
| + | |
| - | , function() {
| + | |
| - | $('#cssmenu #pIndicator').css('left', posLeft);
| + | |
| - | });
| + | |
| - | $('#cssmenu>ul>.has-sub>ul').append('<div class=" submenuArrow"></div>'); | + | |
| - | $('#cssmenu>ul').children('.has-sub').each(function() {
| + | |
| - | var posLeftArrow = $(this).width();
| + | |
| - | posLeftArrow /= 2;
| + | |
| - | posLeftArrow -= 12;
| + | |
| - | $(this).find('.submenuArrow').css('left', posLeftArrow);
| + | |
| - | });
| + | |
| - | $('#cssmenu>ul').prepend('<li id="menu-button"><a>Menu</a></li>');
| + | |
| - | $( "#menu-button" ).click(function(){
| + | |
| - | if ($(this).parent().hasClass('open')) {
| + | |
| - | $(this).parent().removeClass('open');
| + | |
| - | }
| + | |
| - | else {
| + | |
| - | $(this).parent().addClass('open');
| + | |
| - | }
| + | |
| - | });
| + | |
| - | </script> | + | |
| - | | + | |
| - | <!-- Logo -->
| + | |
| - | <h1>Ravenwood Raptors</h1>
| + | |
| - | | + | |
| - | <!-- Navigation -->
| + | |
| - | <div id='cssmenu'>
| + | |
| - | <ul>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors'><span>Home</span></a></li>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Team'><span>Team</span></a>
| + | |
| - | <li class='has-sub'><a href='#'><span>Project</span></a>
| + | |
| - | <ul>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Idea'><span>Overview</span></a>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Process'><span>Process</span></a>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Results'><span>Results</span></a>
| + | |
| - | </ul>
| + | |
| - | <li class='has-sub'><a href='#'><span>Technicalities</span></a>
| + | |
| - | <ul>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Technicalities/Safety'><span>Safety</span></a>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Technicalities/Credits'><span>Credits</span></a>
| + | |
| - | </ul>
| + | |
| - | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Sponsors'><span>Sponsors</span></a>
| + | |
| - | </ul>
| + | |
| | </div> | | </div> |
| - |
| |
| - | <!-- Slider -->
| |
| | | | |
| | </body> | | </body> |
| - |
| |
| | </html> | | </html> |
"
