Team:Manchester/Navbartest2

From 2013.igem.org

(Difference between revisions)
(Created page with "{{:Team:Manchester/layout/noheader}} <html> <head> <script type='text/javascript' src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <script type='text/javascript' src="...")
 
(41 intermediate revisions not shown)
Line 3: Line 3:
<html>
<html>
<head>
<head>
-
<script type='text/javascript' src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
+
<title id="title"> page </title>
-
<script type='text/javascript' src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
+
<script type='text/javascript'>
<script type='text/javascript'>
-
function hoverLink1()
+
function hover1()
{
{
-
   $("#block #link1").hover(function() {
+
   $("#block").hover(function() {
       $("#block #image1").toggleClass("expand");
       $("#block #image1").toggleClass("expand");
  });
  });
-
   $("#block #link1").mouseenter(function() {
+
   $("#block").mouseenter(function() {
    $("#block #image1").css({marginLeft: "40px"});
    $("#block #image1").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link1").mouseleave(function() {
+
   $("#block").mouseleave(function() {
-
    $("#block #image1").css({marginLeft: "50px"});  
+
    $("#block #image1").css({marginLeft: "50px"});
   });
   });
}
}
-
function hoverImage1()
+
function hover2()
{
{
-
   $("#block #image1").mouseenter(function() {
+
   $("#block").mouseenter(function() {
    $("#block #image1").css({marginLeft: "40px"});
    $("#block #image1").css({marginLeft: "40px"});
  });
  });
-
     $("#block #image1").mouseleave(function() {
+
     $("#block").mouseleave(function() {
-
    $("#block #image1").css({marginLeft: "50px"});  
+
    $("#block #image1").css({marginLeft: "50px"});
   });
   });
}
}
-
function hoverLink2()
+
function hover3()
{
{
-
   $("#block #link2").hover(function() {
+
   $("#block1").hover(function() {
-
  $("#block #image2").toggleClass("expand");
+
      $("#block1 #image2").toggleClass("expand");
  });
  });
-
   $("#block #link2").mouseenter(function() {
+
   $("#block1").mouseenter(function() {
-
    $("#block #image2").css({marginLeft: "40px"});
+
    $("#block1 #image2").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link2").mouseleave(function() {
+
   $("#block1").mouseleave(function() {
-
    $("#block #image2").css({marginLeft: "50px"});  
+
    $("#block1 #image2").css({marginLeft: "50px"});
   });
   });
 +
  $("#block1").mouseenter(function() {
 +
      $("#block1 .submenu").show();
 +
  });
 +
  $("#block1").mouseleave(function() {
 +
      $("#block1 .submenu").hide();
 +
  });
}
}
-
function hoverImage2()
+
function hover4()
{
{
-
   $("#block #image2").mouseenter(function() {
+
   $("#block2").hover(function() {
-
    $("#block #image2").css({marginLeft: "40px"});
+
      $("#block2 #image3").toggleClass("expand");
-
  });
+
-
  $("#block #image2").mouseleave(function() {
+
-
    $("#block #image2").css({marginLeft: "50px"});
+
-
          });
+
-
}
+
-
 
+
-
function hoverLink3()
+
-
{
+
-
  $("#block #link3").hover(function() {
+
-
  $("#block #image3").toggleClass("expand");
+
  });
  });
-
   $("#block #link3").mouseenter(function() {
+
   $("#block2").mouseenter(function() {
-
    $("#block #image3").css({marginLeft: "40px"});
+
    $("#block2 #image3").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link3").mouseleave(function() {
+
   $("#block2").mouseleave(function() {
-
    $("#block #image3").css({marginLeft: "50px"});  
+
    $("#block2 #image3").css({marginLeft: "50px"});
   });
   });
-
}
+
   $("#block2").mouseenter(function() {
-
 
+
      $("#block2 .submenu").show();
-
function hoverImage3()
+
-
{
+
-
   $("#block #image3").mouseenter(function() {
+
-
    $("#block #image3").css({marginLeft: "40px"});
+
-
  });
+
-
    $("#block #image3").mouseleave(function() {
+
-
    $("#block #image3").css({marginLeft: "50px"});  
+
   });
   });
 +
  $("#block2").mouseleave(function() {
 +
      $("#block2 .submenu").hide();
 +
  });
}
}
-
function hoverLink4()
+
 
 +
function hover5()
{
{
-
   $("#block #link4").hover(function() {
+
   $("#block3").hover(function() {
-
  $("#block #image4").toggleClass("expand");
+
      $("#block3 #image6").toggleClass("expand");
  });
  });
-
   $("#block #link4").mouseenter(function() {
+
   $("#block3").mouseenter(function() {
-
    $("#block #image4").css({marginLeft: "40px"});
+
    $("#block3 #image6").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link4").mouseleave(function() {
+
   $("#block3").mouseleave(function() {
-
    $("#block #image4").css({marginLeft: "50px"});  
+
    $("#block3 #image6").css({marginLeft: "50px"});
   });
   });
-
}
+
   $("#block3").mouseenter(function() {
-
 
+
      $("#block3 .submenu").show();
-
function hoverImage4()
+
-
{
+
-
   $("#block #image4").mouseenter(function() {
+
-
    $("#block #image4").css({marginLeft: "40px"});
+
-
  });
+
-
    $("#block #image4").mouseleave(function() {
+
-
    $("#block #image4").css({marginLeft: "50px"});  
+
   });
   });
 +
  $("#block3").mouseleave(function() {
 +
      $("#block3 .submenu").hide();
 +
  });
}
}
-
function hoverLink5()
+
function hover6()
{
{
-
   $("#block #link5").hover(function() {
+
   $("#block4").hover(function() {
-
  $("#block #image5").toggleClass("expand");
+
      $("#block4 #image4").toggleClass("expand");
  });
  });
-
   $("#block #link5").mouseenter(function() {
+
   $("#block4").mouseenter(function() {
-
    $("#block #image5").css({marginLeft: "40px"});
+
    $("#block4 #image4").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link5").mouseleave(function() {
+
   $("#block4").mouseleave(function() {
-
    $("#block #image5").css({marginLeft: "50px"});  
+
    $("#block4 #image4").css({marginLeft: "50px"});
   });
   });
-
}
+
   $("#block4").mouseenter(function() {
-
 
+
      $("#block4 .submenu").show();
-
function hoverImage5()
+
-
{
+
-
   $("#block #image5").mouseenter(function() {
+
-
    $("#block #image5").css({marginLeft: "40px"});
+
-
  });
+
-
    $("#block #image5").mouseleave(function() {
+
-
    $("#block #image5").css({marginLeft: "50px"});  
+
   });
   });
 +
  $("#block4").mouseleave(function() {
 +
      $("#block4 .submenu").hide();
 +
  });
}
}
-
function hoverLink6()
+
function hover7()
{
{
-
   $("#block #link6").hover(function() {
+
   $("#block5").hover(function() {
-
  $("#block #image6").toggleClass("expand");
+
      $("#block5 #image5").toggleClass("expand");
  });
  });
-
   $("#block #link6").mouseenter(function() {
+
   $("#block5").mouseenter(function() {
-
    $("#block #image6").css({marginLeft: "40px"});
+
    $("#block5 #image5").css({marginLeft: "40px"});
  });
  });
-
   $("#block #link6").mouseleave(function() {
+
   $("#block5").mouseleave(function() {
-
    $("#block #image6").css({marginLeft: "50px"});  
+
    $("#block5 #image5").css({marginLeft: "50px"});
   });
   });
 +
  $("#block5").mouseenter(function() {
 +
      $("#block5 .submenu").show();
 +
  });
 +
  $("#block5").mouseleave(function() {
 +
      $("#block5 .submenu").hide();
 +
  });
}
}
-
function hoverImage6()
+
function highlight()
{
{
-
   $("#block #image6").mouseenter(function() {
+
   var title = document.title;
-
    $("#block #image6").css({marginLeft: "40px"});
+
  switch(title)
-
  });
+
  {
-
    $("#block #image6").mouseleave(function() {
+
      /*case "Team:Manchester/OurTeamtest - 2013.igem.org":
-
    $("#block #image6").css({marginLeft: "50px"});  
+
      $("#block1").addClass("highlight");
-
   });
+
      break;
 +
 
 +
      case "Team:Manchester/Projecttest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;   
 +
 
 +
      case "Team:Manchester/Aimtest2 - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;
 +
 
 +
      case "Team:Manchester/Notebooktest2 - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;
 +
 
 +
      case "Team:Manchester/LabBooktest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;   
 +
 
 +
      case "Team:Manchester/contributiontest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;
 +
 
 +
      case "Team:Manchester/Safetytest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;
 +
 
 +
      case "Team:Manchester/medaltest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;
 +
 
 +
      case "Team:Manchester/Attributionstest - 2013.igem.org":
 +
      $("#block2").addClass("highlight");
 +
      break;*/
 +
   }
}
}
Line 159: Line 182:
left:0;
left:0;
z-index:100;
z-index:100;
-
 
}
}
-
#block
+
#block, #block1, #block2, #block3, #block4, #block5
{
{
float:left;
float:left;
Line 168: Line 190:
height:80px;
height:80px;
margin:0 5px;
margin:0 5px;
-
border:1px solid black;
 
}
}
-
#block a
+
#block a, #block1 a, #block2 a, #block3 a, #block4 a, #block5 a
{
{
display:block;
display:block;
Line 188: Line 209:
border:1px solid #4C0082;
border:1px solid #4C0082;
 +
 +
-webkit-transition-duration:0.1s;
 +
-webkit-timing-function:linear;
transition-duration:0.1s;
transition-duration:0.1s;
transition-timing-function:linear;
transition-timing-function:linear;
}
}
-
#block img
+
#block img,#block1 img,#block2 img,#block3 img,#block4 img, #block5 img
{
{
 +
-webkit-transition-duration:0.1s;
 +
-webkit-timing-function:linear;
transition-duration:0.1s;
transition-duration:0.1s;
transition-timing-function:linear;
transition-timing-function:linear;
Line 200: Line 226:
}
}
-
#block img:hover
+
#block img:hover,#block1 img:hover,#block2 img:hover,#block3 img:hover,#block4 img:hover, #block5 img:hover
{
{
width:65px;
width:65px;
Line 206: Line 232:
}
}
-
#block .list
+
#block .list,#block1 .list,#block2 .list,#block3 .list,#block4 .list
{
{
margin:0;
margin:0;
}
}
-
#block .list li
+
#block .list li, #block1 .list li, #block2 .list li, #block3 .list li, #block4 .list li
{
{
display:block;
display:block;
list-style:none;
list-style:none;
 +
margin:0;
}
}
-
#block .list .submenu, .submenu1, .submenu2
+
.submenu
{
{
position:relative;
position:relative;
Line 234: Line 261:
}
}
-
#block .list .submenu li a
+
#block1 .list .submenu li a, #block2 .list .submenu li a, #block3 .list .submenu li a, #block4 .list .submenu li a
{
{
clear:both;
clear:both;
Line 247: Line 274:
}
}
-
#block .list li .submenu li:hover .submenu1 a
+
#block4 .list .submenu li .submenu1, #block4 .list .submenu li .submenu2
 +
{
 +
margin:0;
 +
}
 +
 +
#block4 .list .submenu li .submenu1 a, #block4 .list .submenu li .submenu2 a
{
{
-
clear:both;
 
-
display:block;
 
-
border:1px solid #4C0082;
 
margin:0 auto;
margin:0 auto;
-
width:100px;
+
width:110px;
-
font-size: 12px;
+
font-size: 13px;
font-family: Trebuchet MS;
font-family: Trebuchet MS;
font-weight: bold;
font-weight: bold;
color:black;
color:black;
-
background:#ffcc33;
+
background-color:#FFCC33;
}
}
-
#block .list .submenu a:hover  
+
#block4 .list .submenu li .submenu1 a:hover, #block4 .list .submenu li .submenu2 a:hover
{
{
 +
color:white;
display:block;
display:block;
background:#A901DB;
background:#A901DB;
}
}
-
#block .list li:hover .submenu
+
#block1 .list .submenu li a:hover, #block2 .list .submenu li a:hover, #block2 .list .submenu li a:hover,
 +
#block3 .list .submenu li a:hover, #block4 .list .submenu li a:hover
{
{
display:block;
display:block;
 +
background:#A901DB;
}
}
-
.submenu li:hover .submenu1
+
#block .list li:hover .submenu
{
{
display:block;
display:block;
-
position:absolute;
 
-
left:145px;
 
-
top:0;
 
}
}
-
.submenu li:hover .submenu2
+
.expand
{
{
-
display:block;
+
-webkit-transition-duration:0.1s;
-
position:absolute;
+
-webkit-timing-function:linear;
-
left:145px;
+
transition-duration:0.1s;
-
top:28px;
+
transition-timing-function:linear;
-
}
+
-
#block .list li .submenu li:hover .submenu2 a
+
width:65px;
-
{
+
height:65px;
-
clear:both;
+
-
display:block;
+
-
border:1px solid #4C0082;
+
-
margin:0 auto;
+
-
width:150px;
+
-
font-size: 12px;
+
-
font-family: Trebuchet MS;
+
-
font-weight: bold;
+
-
color:black;
+
-
background:#FFCC33;
+
}
}
-
.expand
+
.highlight
{
{
-
width:65px;
+
background:#A901DB;
-
height:65px;
+
}
}
Line 311: Line 328:
</head>
</head>
-
<body onLoad="hoverLink1(); hoverLink2(); hoverLink3(); hoverImage1(); hoverImage2(); hoverImage3();
+
<body onLoad="hover1(); hover2(); hover3(); hover4(); hover5(); hover6(); hover7(); highlight();">
-
              hoverLink4(); hoverImage4(); hoverLink5(); hoverImage5(); hoverLink6(); hoverImage6();">
+
<div class="container">
<div class="container">
         <div id="block">
         <div id="block">
               <img src="https://static.igem.org/mediawiki/2013/7/74/Home.gif" width="50" height="50" id="image1"/>
               <img src="https://static.igem.org/mediawiki/2013/7/74/Home.gif" width="50" height="50" id="image1"/>
-
      <a href="https://2013.igem.org/Team:Manchester/Hometest" id="link1">Home</a>
+
      <a href="https://2013.igem.org/Team:Manchester" id="link1">Home</a>
         </div>
         </div>
-
         <div id="block">
+
         <div id="block1">
             <img src="https://static.igem.org/mediawiki/2013/e/e6/Group.gif" width="50" height="50" id="image2"/>
             <img src="https://static.igem.org/mediawiki/2013/e/e6/Group.gif" width="50" height="50" id="image2"/>
                   <ul class="list">
                   <ul class="list">
-
                     <li><a href="#" id="link2">About</a>
+
                     <li><a href="https://2013.igem.org/Team:Manchester/Team" id="link2">Team</a>
-
                  <ul class="submenu" id="sub1">
+
                  <ul class="submenu">
-
    <li><a href="https://2013.igem.org/Team:Manchester/OurTeamtest" id="link2">Our Team</a></li>
+
                    <li><a href="https://igem.org/Team.cgi?id=1027" target="_blank">Team Profile</a></li>
-
                    <li><a href="https://igem.org/Team.cgi?year=2013" id="link2">Team Profile</a></li>
+
  </ul>
  </ul>
                     </li>
                     </li>
Line 332: Line 347:
         </div>
         </div>
          
          
-
         <div id="block">
+
         <div id="block2">
             <img src="https://static.igem.org/mediawiki/2013/a/a8/Project.gif" width="50" height="50" id="image3"/>
             <img src="https://static.igem.org/mediawiki/2013/a/a8/Project.gif" width="50" height="50" id="image3"/>
               <ul class="list">
               <ul class="list">
-
                   <li><a href="https://2013.igem.org/Team:Manchester/Projecttest" id="link3">Project</a>
+
                   <li><a href="https://2013.igem.org/Team:Manchester/Project" id="link3">Project</a>
                <ul class="submenu">
                <ul class="submenu">
-
    <li><a href="https://2013.igem.org/Team:Manchester/Aimtest2" id="link3">Aim</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Overview" id="link3">Project Overview</a></li>
-
    <li><a href="https://2013.igem.org/Team:Manchester/Notebooktest2" id="link3">Notebook</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Notebook" id="link3">Notebook</a></li>
-
                             <li><a href="#" id="link3">Lab Book</a></li>
+
                             <li><a href="https://2013.igem.org/Team:Manchester/LabBook" id="link3">Lab Book</a></li>
-
                    <li><a href="#" id="link3">Contributions</a></li>
+
                    <li><a href="https://2013.igem.org/Team:Manchester/Parts" id="link3">Parts</a></li>
-
    <li><a href="https://2013.igem.org/Team:Manchester/Safetytest" id="link3">Safety</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Safety" id="link3">Safety</a></li>
-
                             <li><a href="#" id="link3">Judging</a></li>                      
+
                             <li><a href="https://2013.igem.org/Team:Manchester/Judging" id="link3">Judging</a></li>                      
-
    <li><a href="https://2013.igem.org/Team:Manchester/Attributionstest" id="link3">Attributions</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Attributions" id="link3">Attributions</a></li>
        </ul>
        </ul>
                 </li>
                 </li>
Line 349: Line 364:
         </div>
         </div>
-
         <div id="block">
+
         <div id="block3">
             <img src="https://static.igem.org/mediawiki/2013/a/a8/Project.gif" width="50" height="50" id="image6"/>
             <img src="https://static.igem.org/mediawiki/2013/a/a8/Project.gif" width="50" height="50" id="image6"/>
               <ul class="list">
               <ul class="list">
-
                   <li><a href="#" id="link6">Modelling</a>
+
                   <li><a href="https://2013.igem.org/Team:Manchester/Modelling" id="link6">Modelling</a>
                <ul class="submenu">
                <ul class="submenu">
-
    <li><a href="#" id="link6">Fatty Acid Production</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Enzyme" id="link6">Uncertainty Analysis</a></li>
-
    <li><a href="#" id="link6">Parameter Estimation</a></li>
+
                            <li><a href="https://2013.igem.org/Team:Manchester/FabProteinModel" id="link6">FabA Dynamics Model</a></li>
-
                             <li><a href="#" id="link6">Modelling Collaboration</a></li>
+
                          <li><a href="https://2013.igem.org/Team:Manchester/PopulationDynamics" id="link6">Population Dynamics</a></li>
 +
                             <li><a href="https://2013.igem.org/Team:Manchester/Collaboration" id="link6">Modelling Collaboration</a></li>
        </ul>
        </ul>
                 </li>
                 </li>
Line 362: Line 378:
         </div>
         </div>
-
         <div id="block">
+
         <div id="block4">
             <img src="https://static.igem.org/mediawiki/2013/5/5b/Outreach.gif" width="50" height="50" id="image4"/>
             <img src="https://static.igem.org/mediawiki/2013/5/5b/Outreach.gif" width="50" height="50" id="image4"/>
             <ul class="list">
             <ul class="list">
-
                   <li><a href="https://2013.igem.org/Team:Manchester/HumanPracticetest" id="link4">Human Practices</a>
+
                   <li><a href="https://2013.igem.org/Team:Manchester/HumanPractices" id="link4">Human Practices</a>
-
                <ul class="submenu" id="sub3">
+
                <ul class="submenu">
-
    <li><a href="#" id="link4">Public Outreach</a>
+
    <li><a href="https://2013.igem.org/Team:Manchester/Outreach" id="link4">Public Outreach</a>
-
<ul class="submenu1" >
+
<ul class="submenu1">
-
  <a href="https://2013.igem.org/Team:Manchester/stars" id="link4">Science Stars</a></li>
+
  <a href="https://2013.igem.org/Team:Manchester/Stars" id="link4">Science Stars</a></li>
-
  <a href="https://2013.igem.org/Team:Manchester/openday" id="link4">Open day</a></li>
+
  <a href="https://2013.igem.org/Team:Manchester/OpenDay" id="link4">Open day</a></li>
</ul>
</ul>
    </li>
    </li>
-
                    <li><a href="#" id="link4">Ethics</a>
+
                    <li><a href="https://2013.igem.org/Team:Manchester/Ethics" id="link4">Ethics</a>
-
<ul class="submenu2" id="sub3">
+
<ul class="submenu2">
-
    <a href="#" id="link4">Environmental Impact</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/EnvironmentPart1" id="link4">Environmental Impact</a></li>
-
    <a href="#" id="link4">Economical Impact</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/EconomyPart1" id="link4">Economic Impact</a></li>
-
    <a href="#" id="link4">Impact Management</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/ManagementPart1" id="link4">Impact Management</a></li>
-
    <a href="#" id="link4">Conclusion</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/Conclusion" id="link4">Conclusion</a></li>
</ul>
</ul>
    </li>
    </li>
-
    <li><a href="#" id="link4">Business Plan</a></li>
+
                            <li><a href="https://2013.igem.org/Team:Manchester/businessplan" id="link4">Business Plan</a></li>
-
                    <li><a href="#" id="link4">Knowledge Deficit Assumption</a></li>
+
                            <li><a href="https://2013.igem.org/Team:Manchester/Collaboration" id="link4">Modelling Collaboration</a></li>
-
                             <li><a href="#" id="link4">Conferences and Discussions</a></li>
+
                    <li><a href="https://2013.igem.org/Team:Manchester/KnowledgeDeficit" id="link4">Knowledge Deficit Assumption</a></li>
-
                             <li><a href="#" id="link4">Social Media</a></li>
+
                             <li><a href="https://2013.igem.org/Team:Manchester/Conferences" id="link4">Conferences and Discussions</a></li>
 +
                             <li><a href="https://2013.igem.org/Team:Manchester/SocialMedia" id="link4">Social Media</a></li>
                </ul>
                </ul>
                   </li>
                   </li>
Line 390: Line 407:
         </div>
         </div>
-
         <div id="block">
+
         <div id="block5">
             <img src="https://static.igem.org/mediawiki/2013/5/5b/Outreach.gif" width="50" height="50" id="image5"/>
             <img src="https://static.igem.org/mediawiki/2013/5/5b/Outreach.gif" width="50" height="50" id="image5"/>
-
             <a href="#" id="link5">Sponsorship</a>
+
             <a href="https://2013.igem.org/Team:Manchester/Sponsorship" id="link5">Sponsorship</a>
         </div>
         </div>
 
 

Latest revision as of 16:36, 24 October 2013

page