Team:Manchester/Notebooktest

From 2013.igem.org

(Difference between revisions)
Line 7: Line 7:
<script type='text/javascript' src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<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 blocking(nr)
 +
      {
 +
        displayNew = (document.getElementById(nr).style.display == 'none') ? 'block' : 'none';
 +
        document.getElementById(nr).style.display = displayNew;
 +
      }
 +
 
function hoverLink1()
function hoverLink1()
{
{
Line 202: Line 208:
}
}
 +
.menu
 +
{
 +
margin:0 auto;
 +
width:900px;
 +
 +
 +
}
 +
 +
.menu li
 +
{
 +
list-style:none;
 +
 +
}
 +
 +
.menu li a
 +
{
 +
 +
display:block;
 +
width:900px;
 +
height:30px;
 +
text-decoration:none;
 +
text-align:center;
 +
margin-bottom:5px;
 +
font-family:Trebuchet MS;
 +
font-weight:bold;
 +
font-size:24px;
 +
color:white;
 +
background-color:#660099;
 +
 +
-webkit-border-radius: 10px;
 +
border-radius: 10px;
 +
 +
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
 +
}
 +
 +
#submenu li a, #submenu2 li a
 +
{
 +
display:block;
 +
width:800px;
 +
height:30px;
 +
margin:0 auto;
 +
margin-bottom:5px;
 +
font-family:Trebuchet MS;
 +
font-weight:bold;
 +
font-size:18px;
 +
color:white;
 +
background-color:#FFCC33;
 +
}
 +
 +
#text, #text1, #text2, #text3,#text4,#text5,#text6,#text7
 +
{
 +
margin:0 auto;
 +
margin-bottom:5px;
 +
width:700px;
 +
font-family:Trebuchet MS;
 +
font-weight:bold;
 +
font-size:14px;
 +
color:white;
 +
background-color:#BDBDBD;
 +
 +
-webkit-border-radius: 10px;
 +
border-radius: 10px;
 +
 +
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
}
.container
.container
Line 315: Line 391:
<body onLoad="hoverLink1(); hoverLink2(); hoverLink3(); hoverImage1(); hoverImage2(); hoverImage3();
<body onLoad="hoverLink1(); hoverLink2(); hoverLink3(); hoverImage1(); hoverImage2(); hoverImage3();
-
               hoverLink4(); hoverImage4(); hoverLink5(); hoverImage5();">
+
               hoverLink4(); hoverImage4(); hoverLink5(); hoverImage5(); onload="blocking('submenu'); blocking('submenu2'); blocking('text'); blocking('text1'); blocking('text2'); blocking('text3');
 +
blocking('text4'); blocking('text5'); blocking('text6'); blocking('text7'); ">
<div class="header">
<div class="header">
Line 397: Line 474:
<div class="wrapper" >
<div class="wrapper" >
-
     
+
<ul class="menu">
 +
      <li id="one"><a href="" onclick="blocking('submenu'); return false;">June</a>
 +
                  <ul id="submenu">      
 +
        <li id="one"><a href="" onclick="blocking('text'); return false;">Week 1</a>
 +
<div id="text">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
            <li id="two"><a href="" onclick="blocking('text1'); return false;">Week 2</a>
 +
    <div id="text1">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
        <li id="three"><a href="" onclick="blocking('text2'); return false;">Week 3</a>
 +
    <div id="text2">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
        <li id="four"><a href="" onclick="blocking('text3'); return false;">Week 4</a>
 +
    <div id="text3">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
  </ul>
 +
  </li>  
 +
      <li id="one"><a href="" onclick="blocking('submenu2'); return false;">July</a>
 +
    <ul id="submenu2">      
 +
        <li id="one"><a href="" onclick="blocking('text4'); return false;">Week 1</a>
 +
<div id="text4">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
            <li id="two"><a href="" onclick="blocking('text5'); return false;">Week 2</a>
 +
    <div id="text5">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
        <li id="three"><a href="" onclick="blocking('text6'); return false;">Week 3</a>
 +
    <div id="text6">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
        <li id="four"><a href="" onclick="blocking('text7'); return false;">Week 4</a>
 +
    <div id="text7">
 +
                              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
 +
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
 +
  nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
 +
  esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
 +
  in culpa qui officia deserunt mollit anim id est laborum
 +
</div>
 +
</li>
 +
  </ul>
 +
  </li>
 +
  <li id="three"><a href="#three">August</a>
 +
      <!--<ul class="submenu">      
 +
        <li><a href="#one">Week 1</a></li>
 +
            <li><a href="#one">Week 2</a></li>
 +
        <li><a href="#one">Week 3</a></li>
 +
        <li><a href="#one">Week 4</a></li>
 +
  </ul>-->  
 +
  </li>
 +
<!-- <li id="four"><a href="#four">September</a>
 +
      <ul class="submenu">      
 +
        <li><a href="#one">Week 1</a></li>
 +
            <li><a href="#one">Week 2</a></li>
 +
        <li><a href="#one">Week 3</a></li>
 +
        <li><a href="#one">Week 4</a></li>
 +
  </ul>  
 +
  </li>-->
 +
  </ul>     
</div>
</div>

Revision as of 17:54, 23 July 2013

Safety