Template:Team:DukeMBar/CSS

From 2014.igem.org

(Difference between revisions)
 
(25 intermediate revisions not shown)
Line 5: Line 5:
<head>
<head>
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 
-
 
-
<script type="text/javascript" src="http://linacabal.com/juan/ddaccordion.js">
 
-
 
-
/***********************************************
 
-
* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
 
-
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
 
-
* This notice must stay intact for legal use
 
-
***********************************************/
 
-
 
-
</script>
 
-
 
-
<script type="text/javascript">
 
-
 
-
//Initialize Arrow Side Menu:
 
-
ddaccordion.init({
 
-
headerclass: "menuheaders", //Shared CSS class namfe of headers group
 
-
contentclass: "menucontents", //Shared CSS class name of contents group
 
-
revealtype: "mouseover", //Reveal content when user clicks or onmouseover the header? Valid value: "click", or "mouseover"
 
-
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
 
-
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
 
-
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content.
 
-
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
 
-
animatedefault: false, //Should contents open by default be animated into view?
 
-
persiststate: true, //persist state of opened contents within browser session?
 
-
toggleclass: ["unselected", "selected"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
 
-
togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
 
-
animatespeed: 500, //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
 
-
oninit:function(expandedindices){ //custom code to run when headers have initalized
 
-
//do nothing
 
-
},
 
-
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
 
-
//do nothing
 
-
}
 
-
})
 
-
 
-
</script>
 
<style type="text/css">
<style type="text/css">
 +
#navbar ul, #navbar li {
 +
    list-style: none;
 +
    list-style-position:inside;
 +
    margin:0px 0px;
 +
    padding:0;
 +
}
-
 
+
#navbar ul  {
-
.arrowsidemenu{
+
    display:none;
-
width: 180px; /*width of menu*/
+
    position:absolute;
-
border-style: solid solid none solid;
+
    left:0px;
-
border-color: #003EFF; /*#94AA74;*/
+
    width:100%;
-
border-size: 1px;
+
    background-color:#0736A4;
-
border-width: 1px;
+
}
}
-
.arrowsidemenu ul{
+
 
-
list-style-type: none;
+
#navbar li{
-
list-style-image: none;
+
    float:left;
-
}
+
    padding:10px 0px;
-
+
    position:relative;
-
.arrowsidemenu div a{ /*header bar links*/
+
    width:14%; /*16.66%*/
-
font: bold 12px Helvetica, Arial, sans-serif;
+
-
/*display: block;*/
+
-
background: transparent url(https://static.igem.org/mediawiki/2013/2/2f/Arrowblue.gif) 100% 0; /* this is where the arrow goes
+
-
  height: 24px; /*Set to height of bg image-padding within link (ie: 32px - 4px - 4px)*/
+
-
padding: 4px 0 4px 10px;
+
-
line-height: 24px; /*Set line-height of bg image-padding within link (ie: 32px - 4px - 4px)*/
+
-
text-decoration: none;
+
-
}
+
-
+
-
.arrowsidemenu div a:link, .arrowsidemenu div a:visited{
+
-
color: #EDEDED; /*#26370A;*/
+
}
}
-
.arrowsidemenu div a:hover{
+
#navbar > li >ul {
-
background-position: 100% -32px;
+
    margin: 10px 0px;
}
}
-
.arrowsidemenu div.unselected a{ /*header that's currently not selected*/
+
#navbar {
-
color: #EDEDED; /*#283b00;*/
+
    text-align:center;
 +
    /*height: 43px;*/
 +
    background-color:#0736A4;
 +
    margin: 0px 0px 40px 0px;
}
}
-
+
#navbar a {
-
.arrowsidemenu div.selected a{ /*header that's currently selected*/
+
    text-decoration:none;
-
color: #EDEDED; /*#616161;*/
+
    color:white;
-
background-position: 100% -64px !important;
+
    /*font-family:raleway;*/
 +
    font-size:16px;
}
}
-
.arrowsidemenu ul{
+
#navbar li li {
-
list-style-type: none;
+
    width:100%;
-
margin: 0;
+
-
padding: 0;
+
}
}
 +
</style>
-
.arrowsidemenu ul li{
 
-
border-bottom: 1px solid #6183A6 /*#a1c67b;*/
 
-
list-style-type: none;
 
 +
</head>
-
}
+
<body>
 +
<script>
 +
$(document).ready(function(){
 +
  $('#navbar > li').hover(function() {
 +
$(this).find('ul').slideToggle("slow");
 +
});
-
.arrowsidemenu ul li a{ /*sub menu links*/
 
-
display: block;
 
-
background: #ffffff;
 
-
font: normal 12px Helvetica, Arial, sans-serif;
 
-
text-decoration: none;
 
-
color: black;
 
-
padding: 5px 0;
 
-
padding-left: 10px;
 
-
border-left: 10px double #3B4990; /*#a1c67b;  this is the two vertical bars on the sub menus*/
 
-
list-style-type: none;
 
-
}
 
-
.arrowsidemenu ul li a:hover{
+
$('#navbar > li > ul > li').mouseover(function(){
-
background: #d5e5c1;
+
  $(this).css("background-color","#0730D3");
-
}
+
});
-
</style>
+
$('#navbar li').hover(function(){
 +
  $(this).css("background-color","#0736A4");
 +
});
-
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
-
<style type="text/css">
 
-
/* These styles create the dropdown menus. */
 
-
#navbar {
 
-
  margin: 1600;
 
-
  padding: 0;
 
-
  height: 1em; }
 
-
#navbar li {
 
-
  list-style: none;
 
-
  float: left; }
 
-
#navbar li a {
 
-
  padding-left: 6px;
 
-
  padding-bottom: 4px;
 
-
  padding-right: 6px;
 
-
  padding-top: 4px;
 
-
  display: block;
 
-
  background-color: #C1CDCD/*#5d9548;*/
 
-
  color: #fff;
 
-
  text-decoration: none; }
 
-
#navbar li ul {
 
-
  display: none;
 
-
  width: 10em; /* Width to help Opera out */
 
-
  background-color: #80ff00;}
 
-
#navbar li:hover ul, #navbar li.hover ul {
 
-
  display: block;
 
-
  position: absolute;
 
-
  background-color: #C1CDCD; /*#5d9549;*/
 
-
  margin: 0;
 
-
  padding: 0; }
 
-
#navbar li:hover li, #navbar li.hover li {
 
-
  float: none; }
 
-
#navbar li:hover li a, #navbar li.hover li a {
 
-
  background-color: #66b83d;
 
-
  border-bottom: 1px solid #fff;
 
-
  color: white; }
 
-
#navbar li li a:hover {
 
-
  background-color: #C1CDCD;} /*#8db3ff; }*/
 
-
</style>
 
-
<script>
+
$('#navbar > li > a').hover(function(){$(this).parent().css("background-color","#0730D3");}, function(){$(this).parent().css("background-color","#0736A4");});
-
// Javascript originally by Patrick Griffiths and Dan Webb.
+
});
-
// http://htmldog.com/articles/suckerfish/dropdowns/
+
  </script>
-
sfHover = function() {
+
-
  var sfEls = document.getElementById("navbar").getElementsByTagName("li");
+
-
  for (var i=0; i<sfEls.length; i++) {
+
-
      sfEls[i].onmouseover=function() {
+
-
        this.className+=" hover";
+
-
      }
+
-
      sfEls[i].onmouseout=function() {
+
-
        this.className=this.className.replace(new RegExp(" hover\\b"), "");
+
-
      }
+
-
  }
+
-
}
+
-
if (window.attachEvent) window.attachEvent("onload", sfHover);
+
-
</script>
+
-
</head>
+
<!-- 0736A4 is duke blue -->
-
<body>
 
-
<div id="wrap">
+
<ul id="navbar">
 +
        <li><a href="https://2014.igem.org/Team:Duke">Home</a></li>
 +
        <li><a href="https://2014.igem.org/Team:Duke/Team">Team</a>
 +
<ul>
 +
                <li><a href="https://2014.igem.org/Team:Duke/Team">About Us</a></li>
 +
                <li><a href="https://igem.org/Team.cgi?year=2014&amp;team_name=Duke">Official Team Profile</a></li>
 +
                <li><a href="https://2014.igem.org/Team:Duke/Safety">Photo Gallery</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Attributions</a></li>           
 +
</ul>
 +
        </li>     
 +
        <li><a href="https://2014.igem.org/Team:Duke/Project">Project</a>
 +
<ul>
 +
  <li><a href="https://2014.igem.org/Team:Duke/Project#background">Background</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke/Project#summary">Summary</a></li>             
 +
  <li><a href="https://2014.igem.org/Team:Duke">Results</a></li>       
 +
  <li><a href="https://2014.igem.org/Team:Duke">Future Steps</a></li>           
 +
   
 +
</ul>
 +
      </li>
 +
      <li><a href="https://2014.igem.org/Team:Duke/Notebook">Notebook</a>
 +
<ul>
 +
                <li><a href="https://2014.igem.org/Team:Duke/Notebook">Overview</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">Month</a></li>             
 +
        <li><a href="https://2014.igem.org/Team:Duke/Notebook/Protocols">Protocols</a></li>           
 +
</ul>
 +
      </li>
 +
      <li><a href="https://2014.igem.org/Team:Duke">Policy and Practice</a>
 +
        <ul>
 +
                <li><a href="https://2014.igem.org/Team:Duke">3D Printing</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">House Course</a></li>             
 +
                <li><a href="https://2014.igem.org/Team:Duke">NCSSM Team</a></li>             
 +
        </ul>
 +
      </li>       
 +
      <li><a href="https://2014.igem.org/Team:Duke/Safety">Safety</a></li>     
 +
      <li><a href="https://2014.igem.org/"><img src = "https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png" height="17px"></a></li>     
-
<div class="arrowsidemenu">
+
<div style="clear: both;"></div>
-
      <div><a href="https://2013.igem.org/Team:Duke">Home</a></div>
+
</ul>
-
       
+
-
        <div class="menuheaders"><a href="https://2013.igem.org/Team:Duke/Team">Team Duke 2013</a></div>
+
-
            <ul class="menucontents">
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Team#The_Team">The Team</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Team#Undergrads">Undergrads</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Team#Grad_Students">Grad Students</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Team#Instructors">Instructors</a></li>
+
-
            </ul>
+
-
       
+
-
        <div class="menuheaders"><a>Genetic Toggle Switch</a></div>
+
-
            <ul class="menucontents">
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Project/Problem">The Project</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Project/Basics">Background Information</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Project/Design">Experimental Design</a></li>             
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Project/Results/Part1">Results:<br>Library of DNA Parts</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Project/Results/Part2">Results:<br>Parts Characterization</a></li>
+
-
<!--              <li><a href="https://2013.igem.org/Team:Duke/Project/CRISPR_Results">Results: CRISPR</a></li>  -->
+
-
+
-
            </ul>       
+
-
        <div><a href="https://2013.igem.org/Team:Duke/Parts">Biological Parts Submitted</a></div>
+
-
            <!--ul>
+
-
              <li><a href="#">Via Email</a></li>
+
-
              <li><a href="#">Stalk Us Elsewhere</a></li>
+
-
            </ul-->       
+
-
        <div class="menuheaders"><a>Mathematical Modeling</a></div>
+
-
            <ul class="menucontents">
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Modeling/Cooperativity">Cooperativity and Hill Equation</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Modeling/Thermodynamic_Model_Intro">Thermodynamic Model : Introduction</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Modeling/Thermodynamic_Model_Application">Thermodynamic Model : Cooperative Repression</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Modeling/Kinetic_Model">Kinetic Model : <br>Bifurcation and Bistability</a></li>
+
-
            </ul>       
+
-
        <!-- <div><a href="https://2013.igem.org/Team:Duke/Notebook">Results</a></div> -->
+
-
        <div class="menuheaders"><a href="https://2013.igem.org/Team:Duke/Human/">Human Practices</a></div>
+
-
          <ul class="menucontents">
+
-
            <li><a href="https://2013.igem.org/Team:Duke/Human/FromBenchToBiotech">From Bench to Biotech</a></li>
+
-
<!--<li><a href="https://2013.igem.org/Team:Duke/Human/2">BBBB</a></li>-->
+
-
            </ul>
+
-
     
+
-
        <div class="menuheaders"><a>Lab Notebook</a></div>
+
-
            <ul class="menucontents">
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Notebook/Lab_Notebook">Overview</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Notebook/Protocols">Protocols</a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Notebook/Strain List">Strain List</a></li>
+
-
<!--              <li><a href="https://2013.igem.org/Team:Duke/Notebook/Prezi">Project Outline (Prezi) </a></li> -->
+
-
            </ul>       
+
-
        <div class="menuheaders"><a href="https://2013.igem.org/Team:Duke/Safety">Safety</a></div>
+
-
            <ul class="menucontents">
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Safety/Ecoli_and_Scerevisiae"><i>E.coli</i> and <i>S.cerevisiae</i></a></li>
+
-
              <li><a href="https://2013.igem.org/Team:Duke/Safety/Xanthomonas"><i>Xanthomonas</i> Bacteria</a></li>
+
-
            </ul>       
+
-
        <div><a href="https://2013.igem.org/Team:Duke/Attributions">Attributions</a></div>
+
-
            <!--ul>
+
-
              <li><a href="#">1</a></li>
+
-
              <li><a href="#">2</a></li>
+
-
              <li><a href="#">3</a></li>
+
-
            </ul-->     
+
-
<!--        <div><a href="https://2013.igem.org/Team:Duke/Gallery">Gallery</a></div> -->
+
-
       
+
-
        <!-- <div class="menuheaders"><a>University & Jamboree</a></div> -->
+
-
            <!--ul class="menucontents">
+
-
              <li><a href="http://www.uniandes.edu.co">DUKE? </a></li>
+
-
              <li><a href="https://2012.igem.org/Regions/Latin_America/Jamboree">North American Jamboree 2013</a></li>
+
-
            </ul--> 
+
-
<!--
+
-
        <div><a href="https://2013.igem.org/Team:Duke/Sponsors">Our Sponsors</a></div>
+
-
            <!--ul>
+
-
              <li><a href="#">Bench Press</a></li>
+
-
              <li><a href="#">Military Press</a></li>
+
-
              <li><a href="#">Press n Seal</a></li>
+
-
            </ul-->       
+
-
   
+
-
  <div><a href="https://2013.igem.org/">iGEM 2013</a></div>
+
-
     
+
-
    </div>
+
-
 
 
-
     
 
-
  </div>
 
</body>
</body>
</html>
</html>

Latest revision as of 14:41, 16 October 2014

Retrieved from "http://2014.igem.org/Template:Team:DukeMBar/CSS"