Team:Manchester/stars

From 2013.igem.org

(Difference between revisions)
 
(40 intermediate revisions not shown)
Line 1: Line 1:
{{:Team:Manchester/layout/noheader}}
{{:Team:Manchester/layout/noheader}}
{{:Team:Manchester/Footer}}
{{:Team:Manchester/Footer}}
-
{{:Team:Manchester/buttons}}
 
<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 19: Line 16:
   setInterval(function() {
   setInterval(function() {
     $(".slider #"+count).fadeIn(300);
     $(".slider #"+count).fadeIn(300);
-
     $(".slider #"+count).delay(5000).fadeOut(300);
+
     $(".slider #"+count).delay(3000).fadeOut(300);
 
 
if(count == size){
if(count == size){
Line 25: Line 22:
     }else{
     }else{
  count = count + 1;}
  count = count + 1;}
-
   },5000);
+
   },3000);
  }
  }
-
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() {
+
-
    $("#block #image2").css({marginLeft: "40px"});
+
-
  });
+
-
  $("#block #image2").mouseleave(function() {
+
-
    $("#block #image2").css({marginLeft: "50px"});
+
-
          });
+
-
}
+
-
 
+
-
function hoverLink3()
+
{
{
-
   $("#block #link3").hover(function() {
+
   $("#block2").hover(function() {
-
  $("#block #image3").toggleClass("expand");
+
      $("#block2 #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 preview(img)
 +
{
 +
        var lastImg = 11; //Set initial thumbnail and preview
 +
        document.getElementById(10).src = document.getElementById(lastImg).src;
 +
        document.getElementById(lastImg).className = "thumb select";
-
function hoverImage6()
+
        document.getElementById(lastImg).className = "thumb normal";     
-
{
+
        img.className = "thumb select";
-
  $("#block #image6").mouseenter(function() {
+
        document.getElementById(10).src = img.src;
-
    $("#block #image6").css({marginLeft: "40px"});
+
        lastImg = img.id
-
  });
+
-
    $("#block #image6").mouseleave(function() {
+
-
    $("#block #image6").css({marginLeft: "50px"});  
+
-
  });
+
}
}
 +
</script>
</script>
Line 233: Line 225:
position:relative;
position:relative;
width:950px;
width:950px;
-
height:1600px;
+
height:2000px;
}
}
Line 245: Line 237:
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 273: Line 265:
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 285: Line 282:
}
}
-
#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 291: Line 288:
}
}
-
#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 319: Line 317:
}
}
-
#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 332: Line 330:
}
}
-
#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
 
-
{
 
-
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
 
-
{
 
width:65px;
width:65px;
height:65px;
height:65px;
Line 397: Line 380:
position:absolute;
position:absolute;
clear:both;
clear:both;
-
width:960px;
+
width:940px;
-
 
+
height:2100px;
top:110px;
top:110px;
left:0;
left:0;
 +
padding:10px;
background-color:white;
background-color:white;
Line 408: Line 392:
}
}
-
.wrapper .left
+
 
 +
 
 +
.shading .left
{
{
float:left;
float:left;
-
margin:10px 0 5px 20px;
+
margin:10px 0 5px 10px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-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);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
Line 431: Line 417:
}
}
-
.wrapper .right
+
.shading .right
{
{
float:left;
float:left;
-
margin:10px 20px 5px 0;
+
margin:10px 10px 5px 0;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-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);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
Line 450: Line 436:
{
{
clear:both;
clear:both;
-
width:960px;
+
width:940px;
margin:0;
margin:0;
-
 
}
}
.text p
.text p
{
{
-
margin:20px;
+
margin:10px;
background:#F2F2F2;
background:#F2F2F2;
text-align:justify;
text-align:justify;
Line 477: Line 462:
-moz-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);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
 +
}
 +
 +
.graph img
 +
{
 +
margin-left: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);
 +
}
 +
 +
.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
 +
{
 +
background:#bc80ea;
 +
display:block;
 +
float:left;
 +
margin-top:1px;
 +
padding:5px;
 +
}
 +
 +
.block4 a
 +
{
 +
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
 +
{
 +
width:920px;
 +
margin-left:10px;
 +
margin-bottom: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);
 +
}
 +
 +
.preview {
 +
width:920px;
 +
height:360px}
 +
 +
.thumb {
 +
width:290px;
 +
margin:5px 0 5px 10px;
 +
}
 +
 +
.normal {
 +
}
 +
 +
.select {
}
}
Line 482: Line 636:
</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 512: Line 665:
         <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 527: Line 679:
         </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="https://2013.igem.org/Team:Manchester/LabBooktest" 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 544: Line 696:
         </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="https://2013.igem.org/Team:Manchester/Modellingtest" 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>
               </ul>
               </ul>
-
         </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 585: Line 740:
         </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="https://2013.igem.org/Team:Manchester/sponsorstest" id="link5">Sponsorship</a>
             <a href="https://2013.igem.org/Team:Manchester/sponsorstest" id="link5">Sponsorship</a>
Line 592: Line 747:
</div>
</div>
<div class="wrapper">
<div class="wrapper">
 +
<div class="shading">
             <img src="https://static.igem.org/mediawiki/2013/7/7c/ScienceMan.png" class="left" width="150" height="300"/>  
             <img src="https://static.igem.org/mediawiki/2013/7/7c/ScienceMan.png" class="left" width="150" height="300"/>  
              
              
<div class="slider">
<div class="slider">
-
                   <img src="https://static.igem.org/mediawiki/2013/a/a6/Team1.jpg"     id="1"/>
+
                   <img src="https://static.igem.org/mediawiki/2013/b/bf/Stars1.jpg" id="1"/>
-
          <img src="https://static.igem.org/mediawiki/2013/6/6b/Modelling.png" id="2"/>
+
          <img src="https://static.igem.org/mediawiki/2013/6/6b/Stars2.jpg" id="2"/>
-
          <img src="https://static.igem.org/mediawiki/2013/c/ce/Humanpractice.jpg" id="3"/>
+
          <img src="https://static.igem.org/mediawiki/2013/7/7c/Stars5.jpg" id="3"/>
-
          <img src="https://static.igem.org/mediawiki/2013/0/00/Sponsors.jpg" id="4"/>
+
                  <img src="https://static.igem.org/mediawiki/2013/6/6f/Stars6.jpg" id="4"/>
-
          <img src="https://static.igem.org/mediawiki/2013/d/d0/Judging.jpg" id="5"/>
+
                  <img src="https://static.igem.org/mediawiki/2013/0/0b/Stars7.jpg" id="5"/>
-
                  <img src="https://static.igem.org/mediawiki/2013/b/bb/Attributions1.jpg" id="6"/>
+
          <img src="https://static.igem.org/mediawiki/2013/b/be/Stars10.jpg" id="6"/>
 +
          <img src="https://static.igem.org/mediawiki/2013/1/19/Stars11.jpg" id="7"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/b/b2/Stars12.jpg" id="8"/>
 +
                  <img src="https://static.igem.org/mediawiki/2013/c/c5/Stars16.png" id="9"/>
</div>
</div>
Line 607: Line 766:
           <div class="text">                   
           <div class="text">                   
           <p><b>Overview</b><br>
           <p><b>Overview</b><br>
-
On 2nd & 3rd July, Rob, Elsa, Jess, Lorna and Timmy ran a series of 12 workshops for around 200 11-14 year old schoolchildren as part of the University of Manchester Science Stars day (<a href="http://www.ls.manchester.ac.uk/schoolsandcommunity/schoolevents/"> Visit this Event! </a>). This was an activity of two halves. Firstly, Elsa gave a brief and interactive presentation about the structure of DNA, which then lead to our “Sweet DNA” activity (using sweets and cocktail sticks to build a double helix model). This activity introduced the concepts of the double strand, and complementary base pairing of DNA. In some cases, the children had already learned about these topics. However in many cases these ideas were something totally new. Regardless, the children told us they had a lot of fun doing this activity and they felt they had learned a lot.<br></br>
+
On 2nd & 3rd July, Rob, Elsa, Jess, Lorna and Tim ran a series of 12 workshops for around 200 11-14 year old schoolchildren as part of the University of Manchester Science Stars day (<a href="http://www.ls.manchester.ac.uk/schoolsandcommunity/schooleventhighlights/sciencestarsday/"> Visit this Event! </a>). This was an activity of two halves. Firstly, Elsa gave a brief and interactive presentation about the structure of DNA, which then lead to our “Sweet DNA” activity (using sweets and cocktail sticks to build a double helix model). This activity introduced the concepts of the double strand, and complementary base pairing of DNA. In some cases, the children had already learned about these topics. However in many cases these ideas were something totally new. Regardless, the children told us they had a lot of fun doing this activity and they felt they had learned a lot.<br></br>
Next, Rob gave another brief presentation, this time describing our project and explaining the current ways that palm oil is obtained. This then led nicely on to group discussions about what the children would like synthetic biology to be used for, and any ethical implications these ideas may raise, with the team making their way around the groups for more in-depth discussions. As expected, some wild ideas were thrown about. However many of the children had a very mature attitude to the subject and came up with some brilliant concepts and well thought-out ethical ideas. We're sure the future of synthetic biology is in safe hands!</p>
Next, Rob gave another brief presentation, this time describing our project and explaining the current ways that palm oil is obtained. This then led nicely on to group discussions about what the children would like synthetic biology to be used for, and any ethical implications these ideas may raise, with the team making their way around the groups for more in-depth discussions. As expected, some wild ideas were thrown about. However many of the children had a very mature attitude to the subject and came up with some brilliant concepts and well thought-out ethical ideas. We're sure the future of synthetic biology is in safe hands!</p>
 +
 +
<div class="gallery">
 +
<img id="10" class="preview normal" src="" alt="preview" /><br />
 +
<img id="11" class="thumb normal" src="https://static.igem.org/mediawiki/2013/0/09/Stars4.jpg" alt="mountains" onmouseover="preview(this)"/>
 +
<img id="12" class="thumb normal" src="https://static.igem.org/mediawiki/2013/6/60/Stars3.jpg" alt="desert" onmouseover="preview(this)"/>
 +
<img id="13" class="thumb normal" src="https://static.igem.org/mediawiki/2013/a/ad/Stars13.jpg" alt="highway" onmouseover="preview(this)"/>
 +
</div>
<center><iframe src="http://prezi.com/embed/85fbcfd8db359af5ee2a5ed90d8f0d013dfadf4e/?bgcolor=ffffff&amp;lock_to_path=0&amp;autoplay=0&amp;autohide_ctrls=0&amp;features=undefined&amp;disabled_features=undefined" width="920" height="400" frameBorder="0"></iframe></center>
<center><iframe src="http://prezi.com/embed/85fbcfd8db359af5ee2a5ed90d8f0d013dfadf4e/?bgcolor=ffffff&amp;lock_to_path=0&amp;autoplay=0&amp;autohide_ctrls=0&amp;features=undefined&amp;disabled_features=undefined" width="920" height="400" frameBorder="0"></iframe></center>
Line 614: Line 780:
<p><b>Reception</b><br>
<p><b>Reception</b><br>
Both pupils and teachers alike enjoyed the workshop, with many children commenting on how “<i>this [was] better than science class</i>”, “<i>this was the best workshop so far</i>” and that the Sweet DNA helix “<i>was so cool</i>”! Several of the teachers also sincerely thanked us for the workshop, and said that they were going to use the activity again in their classes to teach about DNA. The second half of the sessions was also productive, with pupils eagerly sharing their ideas on what synthetic biology would best be used for. We had some very interesting suggestions come up, including the re-engineering of plants to make them cold-resistant and using the cancer-resistant genes from the naked mole rat to look into cancer prevention. A feedback form was distributed and we got a great response!<br>
Both pupils and teachers alike enjoyed the workshop, with many children commenting on how “<i>this [was] better than science class</i>”, “<i>this was the best workshop so far</i>” and that the Sweet DNA helix “<i>was so cool</i>”! Several of the teachers also sincerely thanked us for the workshop, and said that they were going to use the activity again in their classes to teach about DNA. The second half of the sessions was also productive, with pupils eagerly sharing their ideas on what synthetic biology would best be used for. We had some very interesting suggestions come up, including the re-engineering of plants to make them cold-resistant and using the cancer-resistant genes from the naked mole rat to look into cancer prevention. A feedback form was distributed and we got a great response!<br>
-
<b>[insert pictures of some of the better whiteboard shots (2 or 3 should do)]</b>
+
The schoolchildren and teachers alike were asked whether they agree or disagree that the Science Stars workshops we delivered were interesting/informative/something/something. Below are the results:</p>
-
</p>
+
<div class="graph">
<div class="graph">
-
  <img src="https://static.igem.org/mediawiki/2013/9/9a/SciStarsFeedback.png"/>
+
  <img src="https://static.igem.org/mediawiki/2013/9/9a/SciStarsFeedback.png" width="920" height="300"/>
</div>
</div>
</div>
</div>
</div>
</div>
 +
</div>
 +
                                 
</div>
</div>
</body>
</body>
</html>
</html>

Latest revision as of 17:24, 24 October 2013

Top

Overview
On 2nd & 3rd July, Rob, Elsa, Jess, Lorna and Tim ran a series of 12 workshops for around 200 11-14 year old schoolchildren as part of the University of Manchester Science Stars day ( Visit this Event! ). This was an activity of two halves. Firstly, Elsa gave a brief and interactive presentation about the structure of DNA, which then lead to our “Sweet DNA” activity (using sweets and cocktail sticks to build a double helix model). This activity introduced the concepts of the double strand, and complementary base pairing of DNA. In some cases, the children had already learned about these topics. However in many cases these ideas were something totally new. Regardless, the children told us they had a lot of fun doing this activity and they felt they had learned a lot.

Next, Rob gave another brief presentation, this time describing our project and explaining the current ways that palm oil is obtained. This then led nicely on to group discussions about what the children would like synthetic biology to be used for, and any ethical implications these ideas may raise, with the team making their way around the groups for more in-depth discussions. As expected, some wild ideas were thrown about. However many of the children had a very mature attitude to the subject and came up with some brilliant concepts and well thought-out ethical ideas. We're sure the future of synthetic biology is in safe hands!

Reception
Both pupils and teachers alike enjoyed the workshop, with many children commenting on how “this [was] better than science class”, “this was the best workshop so far” and that the Sweet DNA helix “was so cool”! Several of the teachers also sincerely thanked us for the workshop, and said that they were going to use the activity again in their classes to teach about DNA. The second half of the sessions was also productive, with pupils eagerly sharing their ideas on what synthetic biology would best be used for. We had some very interesting suggestions come up, including the re-engineering of plants to make them cold-resistant and using the cancer-resistant genes from the naked mole rat to look into cancer prevention. A feedback form was distributed and we got a great response!
The schoolchildren and teachers alike were asked whether they agree or disagree that the Science Stars workshops we delivered were interesting/informative/something/something. Below are the results: