Team:Imperial College London/test3

From 2011.igem.org

(Difference between revisions)
 
(14 intermediate revisions not shown)
Line 1: Line 1:
-
/*** ESSENTIAL STYLES ***/
+
{{:Team:Imperial_College_London/Templates/Header}}
-
.sf-menu, .sf-menu * {
+
<html>
-
margin: 0;
+
<head>
-
padding: 0;
+
 
-
list-style: none;
+
<style type="text/css">
 +
 
 +
/*Example CSS for the two demo scrollers*/
 +
 
 +
#pscroller1{
 +
width: 930px;
 +
height: 120px;
 +
border: 1px solid #225323;
 +
padding: 0px;
 +
background-color: white;
}
}
-
.sf-menu {
+
 
-
line-height: 1.0;
+
#pscroller1 a{
 +
color: #225323;
}
}
-
.sf-menu ul {
+
 
-
position: absolute;
+
#pscroller1 h2{
-
top: -999em;
+
color: #000000;
-
width: 195px; /* left offset of submenus need to match (see below) */
+
font-style:italic;
-
        z-index:10;
+
}
}
-
.sf-menu ul li {
+
 
-
width: 100%;
+
#pscroller1 h3{
 +
color: #225323;
 +
text-align:right;
}
}
-
.sf-menu li:hover {
+
 
-
visibility: inherit; /* fixes IE7 'sticky bug' */
+
 
 +
.someclass{ //class to apply to your scroller(s) if desired
}
}
-
.sf-menu li {
+
 
-
float: left;
+
</style>
-
position: relative;
+
 
-
        width:                 195px;
+
<script type="text/javascript">
 +
 
 +
/*Example message arrays for the two demo scrollers*/
 +
 
 +
var pausecontent=new Array()
 +
pausecontent[0]='<h2>"Preventing soil erosion by increasing root mass is a novel approach."</h2><h3><a href="http://www.syngenta.com/country/uk/en/Pages/home.aspx/" target="_blank">Dr Stuart John Dunbar, Senior Syngenta Fellow</a></h3>'
 +
pausecontent[1]='<h2>"It is important to note that soil erosion is a world-wide issue and, as such, preventing it or at least helping ameliorate it, would have world-wide impact."</h2><h3><a href="http://www.syngenta.com/country/uk/en/Pages/home.aspx/" target="_blank">Dr Stuart John Dunbar, Senior Syngenta Fellow</a></h3>'
 +
pausecontent[2]='<h2>"I must say I’m impressed with the idea of your group."</h2><h3><a href="http://www.syngenta.com/country/uk/en/Pages/home.aspx/" target="_blank">Mathijs Wuts, Syngenta</a></h3>'
 +
 
 +
</script>
 +
 
 +
<script type="text/javascript">
 +
 
 +
/***********************************************
 +
* Pausing up-down scroller- © Dynamic Drive (www.dynamicdrive.com)
 +
* This notice MUST stay intact for legal use
 +
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
 +
***********************************************/
 +
 
 +
function pausescroller(content, divId, divClass, delay){
 +
this.content=content //message array content
 +
this.tickerid=divId //ID of ticker div to display information
 +
this.delay=delay //Delay between msg change, in miliseconds.
 +
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
 +
this.hiddendivpointer=1 //index of message array for hidden div
 +
document.write('<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>')
 +
var scrollerinstance=this
 +
if (window.addEventListener) //run onload in DOM2 browsers
 +
window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
 +
else if (window.attachEvent) //run onload in IE5.5+
 +
window.attachEvent("onload", function(){scrollerinstance.initialize()})
 +
else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
 +
setTimeout(function(){scrollerinstance.initialize()}, 500)
}
}
-
.sf-menu a {
+
 
-
display: block;
+
// -------------------------------------------------------------------
-
position: relative;
+
// initialize()- Initialize scroller method.
 +
// -Get div objects, set initial positions, start up down animation
 +
// -------------------------------------------------------------------
 +
 
 +
pausescroller.prototype.initialize=function(){
 +
this.tickerdiv=document.getElementById(this.tickerid)
 +
this.visiblediv=document.getElementById(this.tickerid+"1")
 +
this.hiddendiv=document.getElementById(this.tickerid+"2")
 +
this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv))
 +
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
 +
this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px"
 +
this.getinline(this.visiblediv, this.hiddendiv)
 +
this.hiddendiv.style.visibility="visible"
 +
var scrollerinstance=this
 +
document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1}
 +
document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0}
 +
if (window.attachEvent) //Clean up loose references in IE
 +
window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
 +
setTimeout(function(){scrollerinstance.animateup()}, this.delay)
}
}
-
.sf-menu li:hover ul,
+
 
-
.sf-menu li.sfHover ul {
+
 
-
left: 0;
+
// -------------------------------------------------------------------
-
top: 2.5em; /* match top ul list item height */
+
// animateup()- Move the two inner divs of the scroller up and in sync
-
z-index: 99;
+
// -------------------------------------------------------------------
 +
 
 +
pausescroller.prototype.animateup=function(){
 +
var scrollerinstance=this
 +
if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
 +
this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
 +
this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
 +
setTimeout(function(){scrollerinstance.animateup()}, 50)
}
}
-
ul.sf-menu li:hover li ul,
+
else{
-
ul.sf-menu li.sfHover li ul {
+
this.getinline(this.hiddendiv, this.visiblediv)
-
top: -999em;
+
this.swapdivs()
 +
setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
}
}
-
ul.sf-menu li li:hover ul,
 
-
ul.sf-menu li li.sfHover ul {
 
-
left: 15.3em; /* match ul width */
 
-
top: 0;
 
}
}
-
ul.sf-menu li li:hover li ul,
+
 
-
ul.sf-menu li li.sfHover li ul {
+
// -------------------------------------------------------------------
-
top: -999em;
+
// swapdivs()- Swap between which is the visible and which is the hidden div
-
}
+
// -------------------------------------------------------------------
-
ul.sf-menu li li li:hover ul,
+
 
-
ul.sf-menu li li li.sfHover ul {
+
pausescroller.prototype.swapdivs=function(){
-
left: 10em; /* match ul width */
+
var tempcontainer=this.visiblediv
-
top: 0;
+
this.visiblediv=this.hiddendiv
 +
this.hiddendiv=tempcontainer
}
}
-
/*** DEMO SKIN ***/
+
pausescroller.prototype.getinline=function(div1, div2){
-
.sf-menu {
+
div1.style.top=this.visibledivtop+"px"
-
float: left;
+
div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
-
margin-bottom: 1em;
+
-
}
+
-
.sf-menu a {
+
-
border-left: 1px solid #fff;
+
-
border-top: 1px solid #B57533;
+
-
padding: 0.37em 1em 0.37em 1em;
+
-
text-decoration:none;
+
-
        font-family: 'Lucida Grande', sans-serif;
+
-
        font-size:1.4em;
+
-
}
+
-
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
+
-
color: #FFFFFF;
+
-
}
+
-
.sf-menu li {
+
-
background: #A35200;
+
-
}
+
-
.sf-menu li li {
+
-
background: #824200;
+
-
}
+
-
.sf-menu li li li {
+
-
background: #824200;
+
-
}
+
-
.sf-menu li:hover, .sf-menu li.sfHover,
+
-
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
+
-
background: #B57533;
+
-
outline: 0;
+
}
}
-
/*** arrows **/
+
// -------------------------------------------------------------------
-
.sf-menu a.sf-with-ul {
+
// setmessage()- Populate the hidden div with the next message before it's visible
-
padding-right: 2.25em;
+
// -------------------------------------------------------------------
-
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
+
 
 +
pausescroller.prototype.setmessage=function(){
 +
var scrollerinstance=this
 +
if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
 +
setTimeout(function(){scrollerinstance.setmessage()}, 100)
 +
else{
 +
var i=this.hiddendivpointer
 +
var ceiling=this.content.length
 +
this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1
 +
this.hiddendiv.innerHTML=this.content[this.hiddendivpointer]
 +
this.animateup()
}
}
-
.sf-sub-indicator {
 
-
position: absolute;
 
-
display: block;
 
-
right: .75em;
 
-
top: 1.05em; /* IE6 only */
 
-
width: 10px;
 
-
height: 10px;
 
-
text-indent: -999em;
 
-
overflow: hidden;
 
-
background: url('https://static.igem.org/mediawiki/2011/2/2f/ICL_MenuArrow.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
 
-
}
 
-
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
 
-
top: .8em;
 
-
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
 
-
}
 
-
/* apply hovers to modern browsers */
 
-
a:focus > .sf-sub-indicator,
 
-
a:hover > .sf-sub-indicator,
 
-
a:active > .sf-sub-indicator,
 
-
li:hover > a > .sf-sub-indicator,
 
-
li.sfHover > a > .sf-sub-indicator {
 
-
background-position: -10px -100px; /* arrow hovers for modern browsers*/
 
}
}
-
/* point right for anchors in subs */
+
pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
-
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
+
if (tickerobj.currentStyle)
-
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
+
return tickerobj.currentStyle["paddingTop"]
-
/* apply hovers to modern browsers */
+
else if (window.getComputedStyle) //if DOM2
-
.sf-menu ul a:focus > .sf-sub-indicator,
+
return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
-
.sf-menu ul a:hover > .sf-sub-indicator,
+
else
-
.sf-menu ul a:active > .sf-sub-indicator,
+
return 0
-
.sf-menu ul li:hover > a > .sf-sub-indicator,
+
-
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
+
-
background-position: -10px 0; /* arrow hovers for modern browsers*/
+
}
}
-
/*** shadows for all but IE6 ***/
+
</script>
-
.sf-shadow ul {
+
 
-
background: url('https://static.igem.org/mediawiki/2011/9/9f/ICL_Shadow.png') no-repeat bottom right;
+
</head>
-
padding: 0 8px 9px 0;
+
<body>
-
-moz-border-radius-bottomleft: 17px;
+
 
-
-moz-border-radius-topright: 17px;
+
<table width="975px">
-
-webkit-border-top-right-radius: 17px;
+
 
-
-webkit-border-bottom-left-radius: 17px;
+
<tr>
-
}
+
<td colspan="2">
-
.sf-shadow ul.sf-shadow-off {
+
<h1 style="text-align:center;">Welcome to the Imperial College London iGEM 2011 website</h1><br><br>
-
background: transparent;
+
</td>
-
}
+
</tr>
 +
 
 +
<tr valign="top">
 +
<td style="width:688px;">
 +
<h1>Project Outline</h1>
 +
<p><b>Engineering bacteria to help fight soil erosion</b></p>
 +
<p>In arid areas of the world soil erosion is a massive problem. It is caused by wind and rain sweeping away the fertile top soil and can eventually result in <i>desertification</i>.</p>
 +
 
 +
<p>Climate change and unsustainable farming practices are accelerating the rate of desertification to over 31,000 hectares/day. That’s 62, 000 football pitches in a day or half the size of the UK every year.</p>
 +
 
 +
<p>In ordinary circumstances the roots of well established plants help to hold down the top soil, protecting it from erosion. In areas that suffer desertification however plants do not get the chance to establish large enough root networks to anchor the soil and themselves before erosion occurs.</p>
 +
 
 +
<p>This year, Imperial College’s iGEM team have joined the international effort to fight desertification.</p>
 +
 
 +
<p>We hope to engineer bacteria to accelerate plant root development. The bacteria will be designed to secrete the hormone auxin. Seeds will be coated with the bacteria and then planted in the soil. Once the seeds germinate the bacteria will move towards the roots and be taken in by the plant. Inside the roots the bacteria will release auxin – promoting growth and protecting the soil from erosion.</p>
 +
 
 +
<h1>Modules</h1>
 +
<p>Our project consists of 3 modules: Phyto-Route, Auxin Xpress and Gene Guard.</p>
 +
<p>Computer graphics of summary of modules</p>
 +
 
 +
<h1>The Engineering Cycle</h1>
 +
<p>Each module is carried out following the engineering cylcle shown below.</p>
 +
<p style="padding-left:19px;padding-right:0px;"><embed src="https://static.igem.org/mediawiki/igem.org/3/33/ICL_EngineeringCycle.swf" width="646px" height="381.18px" /><p>
 +
</td>
 +
 
 +
<td style="width:287px;">
 +
 
 +
<h2 style="padding-left:0px;">Follow us on</h2>
 +
<a href="http://www.flickr.com/photos/64732447@N05/" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_flickr.png" /></a>
 +
<a href="http://twitter.com/#!/ImperialiGEM11" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_twitter.png" /></a>
 +
<a href="http://imperialigem.blogspot.com/" target="_new"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_blogger.png" /></a>
 +
<a href="http://www.youtube.com/user/ImperialiGEM" target="_new"><img src="https://static.igem.org/mediawiki/2011/d/d3/ICL_youtube.png" /></a>
 +
<a href="http://www.spreaker.com/page#!/show/the_radio_igem_show" target="_new"><img src="https://static.igem.org/mediawiki/2011/b/b3/ICL_RadioLogo.jpg" width="48px" /></a>
 +
 
 +
<br/><br/>
 +
<object width="300" height="330"><param name="wmode" value="transparent" /><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://staticcdn.spreaker.com/swf/player.swf?API_BASE_URL=http%3A%2F%2Fapi.spreaker.com&SITE_BASE_URL=http%3A%2F%2Fwww.spreaker.com&CHAT_BASE_URL=http%3A%2F%2Fpush.spreaker.com&STATION_URL=http%3A%2F%2Fapi.spreaker.com%2Fshow%2F180289%2Fepisode%2Flatest&AUTOPLAY=false&EXTERNAL_INTERFACE=false&DEBUG=false&REFERRER=embedded&EMBEDDED=true" /><embed src="http://staticcdn.spreaker.com/swf/player.swf?API_BASE_URL=http%3A%2F%2Fapi.spreaker.com&SITE_BASE_URL=http%3A%2F%2Fwww.spreaker.com&CHAT_BASE_URL=http%3A%2F%2Fpush.spreaker.com&STATION_URL=http%3A%2F%2Fapi.spreaker.com%2Fshow%2F180289%2Fepisode%2Flatest&AUTOPLAY=false&EXTERNAL_INTERFACE=false&DEBUG=false&REFERRER=embedded&EMBEDDED=true" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" wmode="transparent" width="300" height="330"></embed></object>
 +
 
 +
<br/><br/>
 +
<a href="http://s07.flagcounter.com/more/ivzl"><img src="http://s07.flagcounter.com/count/ivzl/bg_FFFFFF/txt_225323/border_225323/columns_4/maxflags_12/viewers_0/labels_0/pageviews_0/flags_0/" alt="Free counters!" border="0"></a>
 +
 
 +
</td>
 +
</tr>
 +
 
 +
<tr>
 +
<td>
 +
 
 +
</td>
 +
</tr>
 +
 
 +
<tr>
 +
<td colspan="2" style="padding:18px;padding-right:0px;">
 +
 
 +
<p><img src="https://static.igem.org/mediawiki/2011/5/5d/ICL_Modules.png" width="623px" height="623px" /><p>
 +
 
 +
<script type="text/javascript">
 +
 
 +
//new pausescroller(name_of_message_array, CSS_ID, CSS_classname, pause_in_miliseconds)
 +
 
 +
new pausescroller(pausecontent, "pscroller1", "someclass", 5000)
 +
 
 +
</script>
 +
</td>
 +
</tr>
 +
</table>
 +
 
 +
<h1>Sponsors</h1>
 +
<table width="975px" cellpadding="0px">
 +
<tr>
 +
<td>
 +
<p>
 +
<a href="http://www.wellcome.ac.uk/" target="_new">
 +
<img src="https://static.igem.org/mediawiki/2011/d/d2/ICL_WellcomeTrust.gif" width="230" />
 +
</a>
 +
<a href="http://www.eurofinsdna.com" target="_new">
 +
<img src="https://static.igem.org/mediawiki/2011/0/00/ICL_Eurofins.jpg" width="230" style="padding-left:30px;" />
 +
</a>
 +
<a href="http://www.neb.com" target="_new">
 +
<img src="https://static.igem.org/mediawiki/2011/4/4d/ICL_NEB.jpg" width="230" style="padding-left:20px;" />
 +
</a>
 +
<a href="http://www.qiagen.com" target="_new">
 +
<img src="https://static.igem.org/mediawiki/2011/8/80/ICL_Qiagen.jpg" width="130" style="padding-left:20px;" />
 +
</a>
 +
</p>
 +
</td>
 +
</tr>
 +
 
 +
</table>
 +
</body>
 +
</html>

Latest revision as of 13:59, 12 September 2011



Welcome to the Imperial College London iGEM 2011 website

Project Outline

Engineering bacteria to help fight soil erosion

In arid areas of the world soil erosion is a massive problem. It is caused by wind and rain sweeping away the fertile top soil and can eventually result in desertification.

Climate change and unsustainable farming practices are accelerating the rate of desertification to over 31,000 hectares/day. That’s 62, 000 football pitches in a day or half the size of the UK every year.

In ordinary circumstances the roots of well established plants help to hold down the top soil, protecting it from erosion. In areas that suffer desertification however plants do not get the chance to establish large enough root networks to anchor the soil and themselves before erosion occurs.

This year, Imperial College’s iGEM team have joined the international effort to fight desertification.

We hope to engineer bacteria to accelerate plant root development. The bacteria will be designed to secrete the hormone auxin. Seeds will be coated with the bacteria and then planted in the soil. Once the seeds germinate the bacteria will move towards the roots and be taken in by the plant. Inside the roots the bacteria will release auxin – promoting growth and protecting the soil from erosion.

Modules

Our project consists of 3 modules: Phyto-Route, Auxin Xpress and Gene Guard.

Computer graphics of summary of modules

The Engineering Cycle

Each module is carried out following the engineering cylcle shown below.

Follow us on





Free counters!

Sponsors

Retrieved from "http://2011.igem.org/Team:Imperial_College_London/test3"