Template:Team:Nevada:Header
From 2012.igem.org
(Difference between revisions)
Leochong718 (Talk | contribs) |
Leochong718 (Talk | contribs) |
||
Line 1: | Line 1: | ||
- | + | <html> | |
+ | </p> | ||
+ | <!-- INCLUDES JAVASCRIPTS --> | ||
+ | <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> | ||
+ | <script type="text/javascript" src="js/jquery-ui-1.8.15.custom.min.js"></script> | ||
- | |||
- | |||
<style type="text/css"> | <style type="text/css"> | ||
+ | |||
+ | /* Set up body first */ | ||
+ | body { | ||
+ | background: #e9f1ef; | ||
+ | background-image: url('https://static.igem.org/mediawiki/2012/b/be/Background-gradient.jpg'); | ||
+ | background-position: center; | ||
+ | background-repeat: repeat-y; | ||
+ | } | ||
#globalwrapper { | #globalwrapper { | ||
width:1060px; | width:1060px; | ||
Line 11: | Line 21: | ||
height:100%; | height:100%; | ||
} | } | ||
- | |||
- | |||
- | |||
+ | #p-logo { | ||
+ | display:none; | ||
} | } | ||
#top-section { | #top-section { | ||
Line 26: | Line 35: | ||
} | } | ||
- | + | #search-controls { | |
- | + | display:none; | |
- | + | } | |
- | + | #content { | |
- | + | width:100%; | |
+ | margin:0; | ||
+ | padding:0; | ||
+ | border:none; | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
#content { | #content { | ||
border-left-width:0px; | border-left-width:0px; | ||
Line 42: | Line 50: | ||
width:1050px; | width:1050px; | ||
} | } | ||
- | + | .firstHeading { | |
- | + | display:none; | |
+ | margin:0; | ||
+ | padding:0; | ||
} | } | ||
- | # | + | #bodyContent{ |
- | + | width:100%; | |
- | + | border:none; | |
- | + | margin:0; | |
- | + | padding:0; | |
} | } | ||
- | # | + | #bodyContent p { |
- | + | margin:0; | |
- | + | padding:0; | |
- | + | ||
- | padding:0 | + | |
- | + | ||
- | + | ||
} | } | ||
+ | /* END IGEM Header Overrides */ | ||
+ | .ColorGreen { | ||
+ | background-color: #ffd215; | ||
+ | } | ||
+ | #Header { | ||
+ | height: 110px; | ||
+ | width:100%; | ||
+ | border-bottom-width: 1px; | ||
+ | border-bottom-style: solid; | ||
+ | border-bottom-color: #000; | ||
+ | background-image: url(https://static.igem.org/mediawiki/2011/5/54/MichBanner.png); | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: right; | ||
} | } | ||
#NavBar { | #NavBar { | ||
Line 72: | Line 91: | ||
} | } | ||
- | # | + | #TopContainer { |
- | width: | + | width:100%; |
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | height: auto; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .RightBar { | ||
+ | color: #D6D6D6; | ||
+ | background-color: #999; | ||
+ | position: absolute; | ||
+ | height: 100%; | ||
+ | width: 20%; | ||
+ | right: 0px; | ||
+ | top:0px; | ||
+ | opacity:0.3; | ||
+ | } | ||
+ | .LeftBar { | ||
+ | color: #D6D6D6; | ||
+ | background-color: #999; | ||
+ | position: absolute; | ||
+ | height: 100%; | ||
+ | width: 10%; | ||
+ | right: 0px; | ||
+ | opacity:0.3; | ||
+ | } | ||
+ | .TopBar { | ||
+ | color: #333333; | ||
+ | background-color: #999; | ||
+ | position: absolute; | ||
+ | height: 20%; | ||
+ | width: 100%; | ||
+ | top: 0px; | ||
+ | opacity:0.3; | ||
+ | text-align: right; | ||
+ | } | ||
+ | #BLMaizeTile{ | ||
+ | z-index:1; | ||
+ | } | ||
+ | #TLBlueTile{ | ||
+ | z-index:2; | ||
+ | } | ||
+ | .ThinTopBar { | ||
+ | color: #333333; | ||
+ | background-color: #999; | ||
+ | position: absolute; | ||
+ | height: 15%; | ||
+ | width: 100%; | ||
+ | top: 0px; | ||
+ | left:0px; | ||
+ | opacity:0.3; | ||
+ | text-align: right; | ||
+ | } | ||
+ | #ContentArea { | ||
+ | height: auto; | ||
+ | width:100%; | ||
+ | float:left; | ||
+ | margin-bottom:40px; | ||
+ | margin-left:40px; | ||
+ | } | ||
+ | #NavBar a:link { | ||
+ | font-size: 15px; | ||
+ | font-style: normal; | ||
+ | font-weight: bold; | ||
+ | text-decoration: none; | ||
+ | color: #0d2546; | ||
+ | margin-top: 10px; | ||
+ | margin-right: 4px; | ||
+ | margin-bottom: 4px; | ||
+ | margin-left: 4px; | ||
+ | } | ||
+ | #Footer { | ||
+ | float:left; | ||
+ | height: 100px; | ||
+ | width:100%; | ||
+ | border-top:1px solid #000000; | ||
+ | } | ||
+ | #ImgPicker { | ||
+ | color: #999; | ||
+ | background-color: #999; | ||
+ | height: 20%; | ||
+ | width: 100%; | ||
+ | z-index: 5; | ||
+ | position: absolute; | ||
+ | bottom: 0px; | ||
+ | opacity:0.4; | ||
+ | } | ||
+ | #Logo, #Header img.current { | ||
+ | float:left; | ||
+ | clear:right; | ||
+ | } | ||
+ | .ColorBlue { | ||
+ | background-color: #A1BAC0; | ||
+ | } | ||
+ | .ColorBlueLight { | ||
+ | background-color:#455c84; | ||
+ | } | ||
+ | #Abstract { | ||
+ | height: 300px; | ||
+ | width: 500px; | ||
+ | float: left; | ||
+ | } | ||
+ | .ColorWhite { | ||
+ | background-color: #FFFFFF; | ||
+ | } | ||
+ | .dvdr { | ||
+ | color: #FFF; | ||
+ | } | ||
+ | #SlidePanel { | ||
+ | float: left; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | background-color: #CCC; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .tile { | ||
+ | float: left; | ||
+ | height: 300px; | ||
+ | width: 300px; | ||
+ | display: block; | ||
+ | position: relative; | ||
+ | overflow:visible; | ||
} | } | ||
+ | .LargeContentPlane { | ||
+ | border: 2px solid; | ||
+ | border-color:#000000; | ||
+ | border-radius:10px; | ||
+ | width:90%; | ||
+ | height:auto; | ||
+ | margin:10px; | ||
+ | padding:15px; | ||
+ | float:left; | ||
} | } | ||
- | . | + | .ProfPic { |
- | + | float: left; | |
+ | height: 170px; | ||
+ | width: 170pxpx; | ||
+ | display: block; | ||
+ | position: relative; | ||
+ | clear:left; | ||
+ | margin-bottom:20px; | ||
} | } | ||
+ | .ProfDisc { | ||
+ | float:left; | ||
+ | clear:right; | ||
+ | width:500px; | ||
+ | height:170px; | ||
+ | display:block; | ||
+ | position:relative; | ||
+ | margin-bottom:20px; | ||
+ | } | ||
+ | .tileLong { | ||
+ | float: left; | ||
+ | height: 300px; | ||
+ | width: 600px; | ||
+ | display: block; | ||
+ | padding: 0px; | ||
+ | position: relative; | ||
+ | } | ||
+ | .tileLongContent { | ||
+ | float: left; | ||
+ | height: auto; | ||
+ | width: 90%; | ||
+ | display: block; | ||
+ | padding: 20px; | ||
+ | position: relative; | ||
+ | } | ||
+ | #ProjTitle h3 { | ||
+ | margin-right: 20px; | ||
+ | } | ||
+ | .CurrentSlide { | ||
+ | display: inherit; | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | } | ||
+ | .TeamPic { | ||
+ | display: inherit; | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | } | ||
+ | #NavBar a:hover { | ||
+ | color: #000; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | #ProjTitle { | ||
+ | font-size: 1.2em; | ||
+ | font-style: italic; | ||
+ | font-weight: bold; | ||
+ | font-family: Tahoma, Geneva, sans-serif; | ||
+ | text-decoration: none; | ||
+ | float: left; | ||
+ | text-align: right; | ||
+ | height: auto; | ||
+ | width: 100%; | ||
+ | margin-top:10px; | ||
+ | padding-right: 0px; | ||
+ | padding-top: 0px; | ||
+ | padding-bottom: 10px; | ||
+ | padding-left: 0px; | ||
+ | border-bottom:1px solid white; | ||
+ | } | ||
- | + | #HPButton { | |
- | + | width:150px; | |
+ | height:auto; | ||
+ | margin:10px; | ||
+ | margin-left:20px; | ||
+ | padding:10px; | ||
+ | float:left; | ||
+ | text-align:center; | ||
+ | position:relative; | ||
+ | } | ||
+ | #BLImageHome { | ||
+ | display:block; | ||
+ | width:300px; | ||
+ | height:600px; | ||
+ | overflow:visible; | ||
+ | z-index:3; | ||
+ | } | ||
+ | .Slide | ||
+ | { | ||
+ | display:none; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .MouseOverImg { | ||
+ | height: auto; | ||
+ | width: 300px; | ||
+ | opacity: 0.2; | ||
+ | } | ||
+ | #ProjDesc { | ||
+ | font-size:1.1em; | ||
+ | margin-top: 10px; | ||
+ | padding-top: 70px; | ||
+ | padding-right: 20px; | ||
+ | padding-bottom: 20px; | ||
+ | padding-left: 20px; | ||
+ | font-family: Georgia, "Times New Roman", Times, serif; | ||
+ | color: #CCC; | ||
+ | } | ||
- | + | .ProfText { | |
- | + | font-size:1.1em; | |
+ | margin-top: 10px; | ||
+ | padding:5px; | ||
+ | font-family: Georgia, "Times New Roman", Times, serif; | ||
+ | color: #CCC; | ||
+ | } | ||
- | + | #ProjDesc h2 { | |
- | + | color:white; | |
- | + | font-size:1.2em; | |
- | + | } | |
- | + | ||
- | + | .MouseOverImg:Hover { | |
- | + | opacity: 1; | |
- | + | } | |
- | + | ||
- | + | </style> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
+ | <script> | ||
+ | function swapImage() | ||
+ | { | ||
+ | var $curr = $('.CurrentSlide'); | ||
+ | var $next; | ||
+ | if($('.CurrentSlide').next().length > 0 ) | ||
+ | { | ||
+ | $next=$('.CurrentSlide').next(); | ||
+ | } | ||
+ | else | ||
+ | { | ||
+ | $next = $('#SlidePanel img:first'); | ||
+ | } | ||
+ | |||
+ | $curr.fadeOut('slow',function(){$curr.removeClass('CurrentSlide');$next.fadeIn('slow');$next.addClass('CurrentSlide');}); | ||
+ | |||
+ | } | ||
+ | $(document).ready( function() { | ||
+ | setInterval("swapImage()",3000); | ||
+ | }); | ||
+ | </script> | ||
- | |||
</html> | </html> |
Revision as of 22:44, 13 June 2012