Team:Manchester/Navbartest2

From 2013.igem.org

(Difference between revisions)
Line 69: Line 69:
-
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();
 +
  });
 +
  $("#block4").mouseleave(function() {
 +
      $("#block4 .submenu").hide();
 +
  });
}
}
-
function hoverImage5()
+
 
 +
function hover7()
{
{
-
   $("#block #image5").mouseenter(function() {
+
   $("#block5").hover(function() {
-
    $("#block #image5").css({marginLeft: "40px"});
+
      $("#block5 #image5").toggleClass("expand");
 +
  });
 +
  $("#block5").mouseenter(function() {
 +
    $("#block5 #image5").css({marginLeft: "40px"});
  });
  });
-
    $("#block #image5").mouseleave(function() {
+
  $("#block5").mouseleave(function() {
-
    $("#block #image5").css({marginLeft: "50px"});  
+
    $("#block5 #image5").css({marginLeft: "50px"});
   });
   });
 +
  $("#block5").mouseenter(function() {
 +
      $("#block5 .submenu").show();
 +
  });
 +
  $("#block5").mouseleave(function() {
 +
      $("#block5 .submenu").hide();
 +
  });
}
}
-
 
+
/*function hoverLink6()
-
function hoverLink6()
+
{
{
   $("#block #link6").hover(function() {
   $("#block #link6").hover(function() {
Line 137: Line 148:
    $("#block #image6").css({marginLeft: "50px"});  
    $("#block #image6").css({marginLeft: "50px"});  
   });
   });
-
}
+
}*/
</script>
</script>
Line 152: Line 163:
left:0;
left:0;
z-index:100;
z-index:100;
-
 
}
}
-
#block,#block1,#block2,#block3,#block4
+
#block, #block1, #block2, #block3, #block4, #block5
{
{
float:left;
float:left;
Line 164: Line 174:
}
}
-
#block a,#block1 a,#block2 a,#block3 a,#block4 a
+
#block a, #block1 a, #block2 a, #block3 a, #block4 a, #block5 a
{
{
display:block;
display:block;
Line 185: Line 195:
}
}
-
#block img,#block1 img,#block2 img,#block3 img,#block4 img
+
#block img,#block1 img,#block2 img,#block3 img,#block4 img, #block5 img
{
{
transition-duration:0.1s;
transition-duration:0.1s;
Line 193: Line 203:
}
}
-
#block img:hover,#block1 img:hover,#block2 img:hover,#block3 img:hover,#block4 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 208: Line 218:
display:block;
display:block;
list-style:none;
list-style:none;
 +
margin:0;
}
}
Line 219: Line 230:
}
}
-
#block .list .submenu li
+
/*#block .list .submenu li
{
{
list-style:none;
list-style:none;
Line 239: Line 250:
color:#f2f2f2;
color:#f2f2f2;
}
}
-
  .submenu li:hover .submenu1 a
+
   
 +
.submenu li:hover .submenu1 a
{
{
clear:both;
clear:both;
Line 251: Line 263:
color:black;
color:black;
background:#ffcc33;
background:#ffcc33;
-
}
+
}*/
.submenu a:hover  
.submenu a:hover  
Line 262: Line 274:
{
{
display:block;
display:block;
-
}
+
}*/
-
.submenu li:hover .submenu1  
+
/*.submenu li:hover .submenu1  
{
{
display:block;
display:block;
Line 287: Line 299:
margin:0 auto;
margin:0 auto;
width:150px;
width:150px;
 +
font-size: 12px;
 +
font-family: Trebuchet MS;
 +
font-weight: bold;
 +
color:black;
 +
background:#FFCC33;
 +
}*/
 +
 +
.submenu1 a, .submenu2 a
 +
{
 +
clear:both;
 +
display:block;
 +
border:1px solid #4C0082;
 +
margin:0 auto;
 +
width:100px;
font-size: 12px;
font-size: 12px;
font-family: Trebuchet MS;
font-family: Trebuchet MS;
Line 303: Line 329:
</head>
</head>
-
<body onLoad="hover1(); hover2(); hover3(); hover4(); hoverLink1(); hoverLink2(); hoverLink3(); hoverImage1(); hoverImage2(); hoverImage3();hoverLink4(); hoverImage4(); hoverLink5(); hoverImage5(); hoverLink6(); hoverImage6();">
+
<body onLoad="hover1(); hover2(); hover3(); hover4(); hover5(); hover6(); hover7();">
<div class="container">
<div class="container">
Line 357: Line 383:
             <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/HumanPracticetest" id="link4">Human Practices</a>
-
                <ul class="submenu" id="sub3">
+
                <ul class="submenu">
    <li><a href="#" id="link4">Public Outreach</a>
    <li><a href="#" 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>
Line 365: Line 391:
    </li>
    </li>
                    <li><a href="#" id="link4">Ethics</a>
                    <li><a href="#" id="link4">Ethics</a>
-
<ul class="submenu" id="sub3">
+
<ul class="submenu2">
-
    <a href="#" id="link4">Environmental Impact</a></li>
+
  <li><a href="#" id="link4">Environmental Impact</a></li>
-
    <a href="#" id="link4">Economical Impact</a></li>
+
  <li><a href="#" id="link4">Economical Impact</a></li>
-
    <a href="#" id="link4">Impact Management</a></li>
+
  <li><a href="#" id="link4">Impact Management</a></li>
-
    <a href="#" id="link4">Conclusion</a></li>
+
  <li><a href="#" id="link4">Conclusion</a></li>
</ul>
</ul>
    </li>
    </li>

Revision as of 13:42, 19 August 2013