Team:Manchester/openday

From 2013.igem.org

(Difference between revisions)
 
(42 intermediate revisions not shown)
Line 4: Line 4:
<html>
<html>
<head>
<head>
-
<script type='text/javascript' src="http://code.jquery.com/jquery-1.8.0.min.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' >
Line 11: Line 9:
  {
  {
   $(".slider #1").fadeIn(300);
   $(".slider #1").fadeIn(300);
-
   $(".slider #1").delay(5000).fadeOut(300);
+
   $(".slider #1").delay(3000).fadeOut(300);
    
    
   var size = $(".slider img").size();
   var size = $(".slider img").size();
Line 27: Line 25:
  }
  }
-
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();
-
function hoverImage6()
+
-
{
+
-
   $("#block #image6").mouseenter(function() {
+
-
    $("#block #image6").css({marginLeft: "40px"});
+
-
  });
+
-
    $("#block #image6").mouseleave(function() {
+
-
    $("#block #image6").css({marginLeft: "50px"});  
+
   });
   });
 +
  $("#block5").mouseleave(function() {
 +
      $("#block5 .submenu").hide();
 +
  });
}
}
 +
</script>
</script>
Line 218: Line 199:
{
{
float:left;
float:left;
-
margin-left:90px;
+
margin-left:120px;
margin-right:10px;
margin-right:10px;
}
}
Line 244: Line 225:
top:15px;
top:15px;
left:0;
left:0;
-
z-index:300;
+
z-index:100;
}
}
-
#block
+
#block, #block1, #block2, #block3, #block4, #block5
{
{
float:left;
float:left;
width:150px;
width:150px;
-
margin:0 6px;
+
height:80px;
-
 
+
margin:0 5px;
}
}
-
#block a
+
#block a, #block1 a, #block2 a, #block3 a, #block4 a, #block5 a
{
{
display:block;
display:block;
Line 272: Line 253:
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 284: Line 270:
}
}
-
#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 290: Line 276:
}
}
-
#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 318: Line 305:
}
}
-
#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 331: Line 318:
}
}
-
#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
 
-
{
 
-
display:block;
 
-
position:absolute;
 
-
left:145px;
 
-
top:28px;
 
-
}
 
-
 
-
#block .list li .submenu li:hover .submenu2 a
 
-
{
 
-
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
.expand
{
{
 +
-webkit-transition-duration:0.1s;
 +
-webkit-timing-function:linear;
 +
transition-duration:0.1s;
 +
transition-timing-function:linear;
 +
width:65px;
width:65px;
height:65px;
height:65px;
Line 396: Line 368:
position:absolute;
position:absolute;
clear:both;
clear:both;
-
width:940px;
+
width:960px;
-
height:705px;
+
height:1200px;
top:110px;
top:110px;
left:0;
left:0;
-
padding:10px;
 
background-color:white;
background-color:white;
-
-webkit-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-
-moz-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1));
+
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-
box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
}
 +
 
 +
.wrapper .left
 +
{
 +
float:left;
 +
margin:10px 0 5px 20px;
 +
-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);
}
}
.slider
.slider
{
{
-
position:absolute;
+
float:left;
-
top:5;
+
margin:10px 10px 5px 10px;
-
left:200px;
+
width:600px;
width:600px;
height:300px;
height:300px;
Line 418: Line 397:
z-index:200;
z-index:200;
-
-webkit-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-
-moz-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1));
+
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-
box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
}
 +
 
 +
.wrapper .right
 +
{
 +
float:left;
 +
margin:10px 20px 5px 0;
 +
-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);
}
}
Line 430: Line 418:
}
}
-
.text
+
.text1, .text2
{
{
-
width:900px;
+
clear:both;
-
margin:0;
+
width:920px;
-
margin-top:310px;
+
margin:20px;
-
margin-left:20px;
+
background:#F2F2F2;
 +
-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);
}
}
-
.text p
+
.text1 p
{
{
-
margin:5px 5px 5px 5px;
+
width:670px;
-
line-height:24px;
+
height:400px;
-
background:#E6E6E6;
+
margin:0;
 +
padding:10px;
 +
background:#F2F2F2;
text-align:justify;
text-align:justify;
color:black;
color:black;
font-family:Trebuchet MS;
font-family:Trebuchet MS;
font-size:14px;
font-size:14px;
 +
color:#4c0082;
 +
}
 +
 +
.text2 p
 +
{
 +
margin:0;
padding:10px;
padding:10px;
 +
background:#F2F2F2;
 +
text-align:justify;
 +
color:black;
 +
font-family:Trebuchet MS;
 +
font-size:14px;
 +
color:#4c0082;
 +
}
-
-webkit-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
.text1 #postit, .text2 #postit
-
-moz-box-shadow: 0px 0px 5px 0px rgba(76,0,130,1));
+
{
-
box-shadow: 0px 0px 5px 0px rgba(76,0,130,1);
+
float:right;
 +
margin:10px;
 +
}
 +
 
 +
.block1 a, .block2 a, .block3 a, .block4 a, .block5 a, .block6 a, .block7 a, .block8 a, .block9 a, .block10 a, .block11 a, .block12 a, .block13 a
 +
{
 +
width:120px;
 +
text-decoration:none;
 +
color:white;
 +
text-align:center;
 +
background:#606060;
 +
padding:5px;
 +
font-style:Trebuchet MS;
 +
font-weight:bold;
 +
font-size:12px;
 +
color:white;
 +
}
 +
 
 +
.block1 a:hover, .block2 a:hover, .block3 a:hover, .block4 a:hover, .block5 a:hover, .block6 a:hover, .block7 a:hover, .block8 a:hover, .block9 a:hover, .block10 a:hover, .block11 a:hover, .block12 a:hover, .block13 a:hover
 +
{
 +
background:#C0C0C0;
 +
color:#606060;
 +
}
 +
 
 +
.leftbar
 +
{
 +
width:120px;
 +
height:600px;
 +
position:fixed;
 +
top:120px;
 +
left:5px;
 +
}
 +
 
 +
.block1 a
 +
{
 +
background:#660099;
 +
float:left;
 +
display:block;
 +
padding:5px;
 +
}
 +
 
 +
.block2 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block3 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block4 a
 +
{
 +
background:#bc80ea;
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block5 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block6 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block7 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block8 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
 
 +
padding:5px;
 +
}
 +
 
 +
.block9 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block10 a
 +
{
 +
 
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block11 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block12 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.block13 a
 +
{
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 
 +
.gallery
 +
{
 +
margin-left:170px;
 +
}
 +
 
 +
.preview {
 +
width:640px;
 +
height:360px}
 +
 
 +
.thumb {
 +
width:205px;
 +
margin-right:3px;}
 +
 
 +
.normalx {
 +
 
 +
-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);
 +
border:1px solid #ccc;
 +
}
 +
 
 +
.selectedx {
 +
-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);
 +
border:1px solid #ccc;
 +
}
 +
 
 +
#postit
 +
{
 +
margin-top:20px;
 +
margin-left:50px;
 +
-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);
}
}
Line 457: Line 637:
</head>
</head>
-
<body onLoad="showImage(); hoverLink1(); hoverLink2(); hoverLink3(); hoverImage1(); hoverImage2(); hoverImage3();
+
<body onLoad="showImage(); hover1(); hover2(); hover3(); hover4(); hover5(); hover6(); hover7(); preview();">
-
              hoverLink4(); hoverImage4(); hoverLink5(); hoverImage5(); hoverLink6(); hoverImage6();">
+
<div class="header">
<div class="header">
<div class="banner">
<div class="banner">
  <div class="igem">  
  <div class="igem">  
-
  <a>
+
  <a href="https://2013.igem.org/Main_Page">
           <img src="https://static.igem.org/mediawiki/2013/3/3f/Igem.png">
           <img src="https://static.igem.org/mediawiki/2013/3/3f/Igem.png">
           </a>
           </a>
Line 473: Line 652:
           <div class="central">  
           <div class="central">  
-
    <a><img src="https://static.igem.org/mediawiki/2013/3/3c/Stars.png"></a>
+
    <a><img src="https://static.igem.org/mediawiki/2013/e/e3/OpendayMan.png"></a>
  </div>  
  </div>  
Line 487: Line 666:
         <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/Hometest3" 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/OurTeamtest" 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 502: Line 680:
         </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/Projecttest" 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/Aimtest2" 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/Notebooktest2" id="link3">Notebook</a></li>
-
                             <li><a href="#" id="link3">Lab Book</a></li>
+
                             <li><a href="https://2013.igem.org/Team:Manchester/LabBooktest" id="link3">Lab Book</a></li>
-
                    <li><a href="#" id="link3">Contributions</a></li>
+
                    <li><a href="https://2013.igem.org/Team:Manchester/contributiontest" 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/Safetytest" id="link3">Safety</a></li>
-
                             <li><a href="#" id="link3">Judging</a></li>                      
+
                             <li><a href="https://2013.igem.org/Team:Manchester/medaltest" 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/Attributionstest" id="link3">Attributions</a></li>
        </ul>
        </ul>
Line 519: Line 697:
         </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/Modellingtest" id="link6">Modelling</a>
                <ul class="submenu">
                <ul class="submenu">
-
    <li><a href="#" id="link6">Fatty Acid Production</a></li>
+
 
-
    <li><a href="#" id="link6">Parameter Estimation</a></li>
+
    <li><a href="https://2013.igem.org/Team:Manchester/parametertest" id="link6">Uncertainty Analysis</a></li>
-
                             <li><a href="#" id="link6">Modelling Collaboration</a></li>
+
                            <li><a href="https://2013.igem.org/Team:Manchester/fabAmodeltest" id="link6">FabA Dynamics Model</a></li>
 +
                          <li><a href="https://2013.igem.org/Team:Manchester/popdynamictest" id="link6">Population Dynamics</a></li>
 +
                             <li><a href="https://2013.igem.org/Team:Manchester/collabtest" id="link6">Modelling Collaboration</a></li>
        </ul>
        </ul>
                 </li>
                 </li>
Line 532: Line 712:
         </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/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="https://2013.igem.org/Team:Manchester/outreachtest" 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/ethicstest" 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/environmenttest" id="link4">Environmental Impact</a></li>
-
    <a href="#" id="link4">Economical Impact</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/economytest" id="link4">Economic Impact</a></li>
-
    <a href="#" id="link4">Impact Management</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/managementtest" id="link4">Impact Management</a></li>
-
    <a href="#" id="link4">Conclusion</a></li>
+
  <li><a href="https://2013.igem.org/Team:Manchester/conclusiontest" 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/businesstest" 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/collabtest" 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/knoledgetest" 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/conferencetest" id="link4">Conferences and Discussions</a></li>
 +
                             <li><a href="https://2013.igem.org/Team:Manchester/socialtest" id="link4">Social Media</a></li>
                </ul>
                </ul>
                   </li>
                   </li>
Line 560: Line 741:
         </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/sponsorstest" id="link5">Sponsorship</a>
         </div>
         </div>
 
 
</div>
</div>
-
 
<div class="wrapper">
<div class="wrapper">
-
             <div class="slider">
+
             <img src="https://static.igem.org/mediawiki/2013/9/9f/OpenMan.png" class="left" width="150" height="300"/>
-
                   <img src="https://static.igem.org/mediawiki/2013/a/a6/Team1.jpg"     id="1"/>
+
           
-
          <img src="https://static.igem.org/mediawiki/2013/6/6b/Modelling.png" id="2"/>
+
<div class="slider">
-
          <img src="https://static.igem.org/mediawiki/2013/c/ce/Humanpractice.jpg" id="3"/>
+
                   <img src="https://static.igem.org/mediawiki/2013/2/2d/Openday19.jpg" width="600" height="300" id="1"/>
-
          <img src="https://static.igem.org/mediawiki/2013/0/00/Sponsors.jpg" id="4"/>
+
          <img src="https://static.igem.org/mediawiki/2013/c/c2/Openday1.jpg" width="600" height="300" id="2"/>
-
          <img src="https://static.igem.org/mediawiki/2013/d/d0/Judging.jpg" id="5"/>
+
          <img src="https://static.igem.org/mediawiki/2013/d/d4/Openday4.jpg" width="600" height="300" id="3"/>
-
                   <img src="https://static.igem.org/mediawiki/2013/b/bb/Attributions1.jpg" id="6"/>
+
          <img src="https://static.igem.org/mediawiki/2013/f/fc/Openday6.jpg" width="600" height="300" id="4"/>
-
           </div>
+
          <img src="https://static.igem.org/mediawiki/2013/4/49/Openday9.jpg" width="600" height="300" id="5"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/d/df/Openday10.jpg" width="600" height="300" id="6"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/5/5c/Openday11.jpg" width="600" height="300" id="7"/>
 +
                   <img src="https://static.igem.org/mediawiki/2013/b/b2/Openday14.jpg" width="600" height="300" id="8"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/7/7f/Openday15.jpg" width="600" height="300" id="9"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/b/b1/Openday2.jpg" width="600" height="300" id="10"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/4/49/Openday8.jpg" width="600" height="300" id="11"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/1/19/Openday12.jpg" width="600" height="300" id="12"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/5/59/Openday3.jpg" width="600" height="300" id="13"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/4/4f/Openday18.jpg" width="600" height="300" id="14"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/d/d6/Openday17.jpg" width="600" height="300" id="15"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/9/9d/Openday7.jpg" width="600" height="300" id="16"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/0/09/Openday5.jpg" width="600" height="300" id="17"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/7/74/Openday16.jpg" width="600" height="300" id="18"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/1/1f/Openday13.jpg" width="600" height="300" id="19"/>
 +
                 
 +
</div>
 +
 
 +
           <img src="https://static.igem.org/mediawiki/2013/0/0a/DayMan.png" class="right" width="150" height="300"/>
 +
 
 +
  <div class="text1"> 
 +
  <a href="https://static.igem.org/mediawiki/2013/2/25/Open_Day_Poster.pdf" target="_blank"><img id="postit" src="https://static.igem.org/mediawiki/2013/2/29/Postercrop.png" width="215" height="400"/></a>                   
 +
          <p><b>Overview:</b><br>
 +
On Saturday 6th July 2013, the outreach team hosted a poster stand at the University of Manchester’s Community Open Day. Everyone in Manchester was invited, meaning that our guests could range from toddlers all the way up to pensioners!
 +
<br><br>
 +
As the Sweet DNA activity went down so well with the schoolchildren during our <a href="https://2013.igem.org/Team:Manchester/stars" target="_blank"> Science Stars</a> workshops, we decided to repeat it once more. Only this time, the kids could actually take away and eat (with their parents’ permission!) their double-helix DNA made out of sweets! We made sure to have at least three team members manning the stall, meaning that whilst the children were busy making their sweet DNA, one team member could talk them through what they were doing and explain how the model that they were making relates to the real structure of DNA. At the same time, the other two team members would have conversations with their parents/guardians, explaining what synthetic biology is, what the iGEM competition is and describing our project in more detail. We also encouraged the people we spoke to to share their concerns, if any, about the use of synthetic biology.<br>
 +
<br>
 +
Click<a href="https://static.igem.org/mediawiki/2013/2/25/Open_Day_Poster.pdf" target="_blank"> here </a>or on the thumbnail on the right to see our full poster!
 +
</p>
 +
  </div>
 +
 
 +
  <div class="text2">
 +
<img id="postit" src="https://static.igem.org/mediawiki/2013/b/b9/IMG_2476.JPG" width="500" height="300"/>
 +
<p><b>Reception:</b><br>
 +
The event was a huge success! Over 700 people visited the open day, and our stall was constantly busy for at least 4 hours. We even had to run out to buy more supplies! We were lucky enough to speak to loads of people about what it is we’re doing over the summer break, and many visitors were fascinated by the potential of synthetic biology. One visitor in particular, a biology teacher who retired before the boom of biotechnology, was amazed by how far the science had come in such a relatively short space of time. People complimented the attractiveness and clarity of our poster and used the information on it to ask us questions, both about the palm oil industry and also about synbio in general. Of course, the children loved their sweet DNA gift too! <br><br>
 +
Feedback was left in the form of a post-it note wall near the exit of the building. Visitors were asked to write a quick comment about the open day and its many stands on a post-it note, and then stick it on the wall for others to see. By the end of the day, the wall was full of colourful notes, all containing lovely comments about the event!<br>
 +
  </div>
-
          <div class="text">
 
-
          <p>
 
-
          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.Lorem ipsum dolor sit amet,
 
-
consectetur adipisicing elit, ed do eiusmod tempor incididunt
 
-
ut labore et dolore magna liqua. 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
 
-
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.Lorem ipsum dolor sit amet,
 
-
consectetur adipisicing elit, ed do eiusmod tempor incididunt
 
-
ut labore et dolore magna liqua. 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
 
-
          </p>
 
-
          </div>
 
</div>
</div>
 +
                 
</div>
</div>
</body>
</body>
</html>
</html>

Latest revision as of 17:25, 24 October 2013

Top

Overview:
On Saturday 6th July 2013, the outreach team hosted a poster stand at the University of Manchester’s Community Open Day. Everyone in Manchester was invited, meaning that our guests could range from toddlers all the way up to pensioners!

As the Sweet DNA activity went down so well with the schoolchildren during our Science Stars workshops, we decided to repeat it once more. Only this time, the kids could actually take away and eat (with their parents’ permission!) their double-helix DNA made out of sweets! We made sure to have at least three team members manning the stall, meaning that whilst the children were busy making their sweet DNA, one team member could talk them through what they were doing and explain how the model that they were making relates to the real structure of DNA. At the same time, the other two team members would have conversations with their parents/guardians, explaining what synthetic biology is, what the iGEM competition is and describing our project in more detail. We also encouraged the people we spoke to to share their concerns, if any, about the use of synthetic biology.

Click here or on the thumbnail on the right to see our full poster!

Reception:
The event was a huge success! Over 700 people visited the open day, and our stall was constantly busy for at least 4 hours. We even had to run out to buy more supplies! We were lucky enough to speak to loads of people about what it is we’re doing over the summer break, and many visitors were fascinated by the potential of synthetic biology. One visitor in particular, a biology teacher who retired before the boom of biotechnology, was amazed by how far the science had come in such a relatively short space of time. People complimented the attractiveness and clarity of our poster and used the information on it to ask us questions, both about the palm oil industry and also about synbio in general. Of course, the children loved their sweet DNA gift too!

Feedback was left in the form of a post-it note wall near the exit of the building. Visitors were asked to write a quick comment about the open day and its many stands on a post-it note, and then stick it on the wall for others to see. By the end of the day, the wall was full of colourful notes, all containing lovely comments about the event!

Retrieved from "http://2013.igem.org/Team:Manchester/openday"