Team:Carnegie Mellon/FAQ
From 2012.igem.org
Line 1: | Line 1: | ||
- | |||
<html> | <html> | ||
+ | |||
+ | <!-- Referenced: https://2011.igem.org/wiki/index.php?title=Team:DTU-Denmark/Templates/Standard_page_begin&action=edit --> | ||
+ | |||
+ | <!-- StyleSheet --> | ||
+ | <link rel="stylesheet" href="https://2012.igem.org/Team:Carnegie_Mellon/stylesheet?action=raw&ctype=text/css" type="text/css" /> | ||
+ | |||
+ | |||
+ | <!-- iGem wiki hacks --> | ||
+ | <!-- Remove all empty <p> tags --> | ||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function() { | ||
+ | $("p").filter( function() { | ||
+ | return $.trim($(this).html()) == ''; | ||
+ | }).remove(); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | |||
+ | <!--Jquery Tools Script--> | ||
+ | <script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"> | ||
+ | </script> | ||
+ | <!--TESTING - Jquery TOC Script--> | ||
+ | <script src="https://2012.igem.org/Team:Carnegie_Mellon/tocjs?action=raw&ctype=text/javascript"> | ||
+ | </script> | ||
+ | |||
+ | <!-- Nav Bar --> | ||
+ | <head> | ||
+ | |||
<!--Table of Contents --> | <!--Table of Contents --> | ||
<div id="toc-holder" class="toc-holder"> | <div id="toc-holder" class="toc-holder"> | ||
Line 15: | Line 42: | ||
</ul> | </ul> | ||
</div><!-- .toc-holder --> | </div><!-- .toc-holder --> | ||
+ | |||
+ | <!-- CMU Banner --> | ||
+ | <p> | ||
+ | <a href="/Image:Cmu2.jpeg" class="image" title="Image:Cmu2.jpeg"><img alt="Image:Cmu2.jpeg" src="/wiki/images/a/a6/Cmu2.jpeg" width="965" height="269" border="0" align="center"/></a> | ||
+ | </p> | ||
+ | |||
+ | |||
+ | <!-- Drop down menu thing --> | ||
+ | <style> | ||
+ | .ddcolortabs{ | ||
+ | padding: 0; | ||
+ | width: 100%; | ||
+ | background: transparent; | ||
+ | voice-family: "\"}\""; | ||
+ | voice-family: inherit; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs ul{ | ||
+ | font: bold 11px Arial; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | list-style:none; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs li{ | ||
+ | display:inline; | ||
+ | margin:0 2px 0 0; | ||
+ | padding:0; | ||
+ | text-transform:uppercase; | ||
+ | } | ||
+ | |||
+ | |||
+ | .ddcolortabs a{ | ||
+ | float:left; | ||
+ | color: white; | ||
+ | background: red url(media/color_tabs_left.gif) no-repeat left top; | ||
+ | margin:0 2px 0 0; | ||
+ | padding:0 0 1px 3px; | ||
+ | text-decoration:none; | ||
+ | letter-spacing: 1px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .ddcolortabs a span{ | ||
+ | float:left; | ||
+ | display:block; | ||
+ | background: transparent url(media/color_tabs_right.gif) no-repeat right top; | ||
+ | padding: 4px 8px 2px 7px; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs a span{ | ||
+ | float:none; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs a:hover{ | ||
+ | background-color: #591f20; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs a:hover span{ | ||
+ | background-color: #591f20; | ||
+ | } | ||
+ | |||
+ | .ddcolortabs .selected a, #ddcolortabs .selected a span{ /*currently selected tab*/ | ||
+ | background-color: #591f20; | ||
+ | } | ||
+ | |||
+ | .ddcolortabsline{ | ||
+ | clear: both; | ||
+ | padding: 0; | ||
+ | width: 96.1%; | ||
+ | height: 4px; | ||
+ | line-height: 100%; | ||
+ | background: black; | ||
+ | border-top: 1px solid #fff; /*Remove this to remove border between bar and tabs*/ | ||
+ | } | ||
+ | |||
+ | |||
+ | /* ######### Style for Drop Down Menu ######### */ | ||
+ | |||
+ | .dropmenudiv_a{ | ||
+ | position:absolute; | ||
+ | top: 0; | ||
+ | border: 1px solid black; /*THEME CHANGE HERE*/ | ||
+ | border-top-width: 8px; /*Top border width. Should match height of .ddcolortabsline above*/ | ||
+ | border-bottom-width: 0; | ||
+ | font:normal 12px Arial; | ||
+ | line-height:18px; | ||
+ | z-index:100; | ||
+ | background-color: #d4d4d4; | ||
+ | width: 200px; | ||
+ | visibility: hidden; | ||
+ | } | ||
+ | |||
+ | |||
+ | .dropmenudiv_a a{ | ||
+ | width: auto; | ||
+ | display: block; | ||
+ | text-indent: 5px; | ||
+ | border-top: 0 solid #678b3f; | ||
+ | border-bottom: 1px solid #678b3f; /*THEME CHANGE HERE*/ | ||
+ | padding: 2px 0; | ||
+ | text-decoration: none; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | * html .dropmenudiv_a a{ /*IE only hack*/ | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .dropmenudiv_a a:hover{ /*THEME CHANGE HERE*/ | ||
+ | background-color: #8a3c3d; | ||
+ | color: white; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | <!-- CSS for Drop Down Tabs Menu #1 --> | ||
+ | <link rel="stylesheet" type="text/css" href="ddcolortabs.css" /> | ||
+ | |||
+ | <div id="colortab" class="ddcolortabs"> | ||
+ | <ul> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon" title="Home"><span>Home</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Overview" title="Overview of the biology" rel="dropmenu1_a"><span>Overview</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Team" title="Meet the team" ><span>The Team</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/BioBricks" title="Our submitted BioBrick<sup>TM</sup> BioBricks" rel="dropmenu1_a"><span>BioBricks</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Notebook" title="Details of labwork, in realtime"><span>Notebook</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Modelling" title="Modeling" rel="dropmenu2_a"><span>Modelling</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Results" title="Results" rel="dropmenu1_a"><span>Results</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Human_Practice" title="Human Practice" rel="dropmenu2_a"><span>Human Practice</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/Acknowledgements" title="Acknowledgements" ><span>Acknowledgements</span></a></li> | ||
+ | <li><a href="https://2012.igem.org/Team:Carnegie_Mellon/FAQ" title="Frequently asked questions" ><span>FAQ</span></a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | |||
+ | <div class="ddcolortabsline"> </div> | ||
+ | <div id="dropmenu1_a" class="dropmenudiv_a"> | ||
+ | <a href="https://2012.igem.org/Team:Carnegie_Mellon/Team">TempLink</a> | ||
+ | </div> | ||
+ | <script type="text/javascript"> | ||
+ | //SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"]) | ||
+ | tabdropdown.init("colortab", 3) | ||
+ | </script> | ||
+ | </div> | ||
+ | |||
+ | |||
</head> | </head> | ||
Revision as of 17:38, 30 July 2012
FAQ
Question 1.Style sheet?
Question 2. Header/Footer?
Question 3. Markup?
Question 4. General Helpful References
Look at our page's source to see the different div-id's used. Go through the stylesheet to see how each element is formatted and the end result.
CSS Zen Garden - Great site on styling with very nice examples
Jquery Tools - Toolbox of common JS uses, very thorough demos
Misc Jquery - Links to other popular Jquery based tools
FAQ
Question 1.
Style sheet?Question 2.
Header/Footer?
Question 3.
Markup?'''Question 4.''' General Helpful References
Look at our page's source to see the different div-id's used. Go through the stylesheet to see how each element is formatted and the end result.
CSS Zen Garden - Great site on styling with very nice examples
Jquery Tools - Toolbox of common JS uses, very thorough demos
Misc Jquery - Links to other popular Jquery based tools