|
|
Line 1: |
Line 1: |
- | {{:Team:Imperial_College_London/Templates/Header}}
| |
- | <html>
| |
- | <head>
| |
| | | |
- | <style type="text/css">
| |
| | | |
- | /*Example CSS for the two demo scrollers*/
| + | <html lang="en"> |
- | | + | <head> |
- | #pscroller1{
| + | <meta http-equiv="content-type" content="text/html;charset=utf-8"> |
- | width: 930px;
| + | <link rel="stylesheet" type="text/css" href="https://2011.igem.org/Team:Imperial_College_London/superfish?action=raw&ctype=text/css" media="screen"> |
- | height: 120px;
| + | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> |
- | border: 1px solid #225323;
| + | <script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/hoverIntent?action=raw&ctype=text/js"></script> |
- | padding: 0px;
| + | <script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/superfishjs?action=raw&ctype=text/js"></script> |
- | background-color: white;
| + | |
- | }
| + | |
- | | + | |
- | #pscroller1 a{
| + | |
- | color: #225323;
| + | |
- | }
| + | |
- | | + | |
- | #pscroller1 h2{
| + | |
- | color: #000000;
| + | |
- | font-style:italic;
| + | |
- | }
| + | |
- | | + | |
- | #pscroller1 h3{
| + | |
- | color: #225323;
| + | |
- | text-align:right;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | .someclass{ //class to apply to your scroller(s) if desired
| + | |
- | }
| + | |
- | | + | |
- | </style> | + | |
- | | + | |
- | <script type="text/javascript"> | + | |
- | | + | |
- | /*Example message arrays for the two demo scrollers*/
| + | |
- | | + | |
- | var pausecontent=new Array()
| + | |
- | pausecontent[0]='<h2>"Application of indole-3-acetic acid (IAA) or IAA-related metabolites stimulates lateral root (LR) and root hair formation."</h2><h3><a href="" target="_blank">Spaepen S, Vanderleyden J, Remans R (2007)</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="https://2011.igem.org/Team:Imperial_College_London/Human_Implementation" target="_blank">Prof. Stuart John Dunbar, Senior Syngenta Fellow</a></h3>'
| + | |
- | pausecontent[2]='<h2>"Plant synthetic biology has been under-appreciated."</h2><h3><a href="http://www.hms.harvard.edu/agingresearch/pages/pamelasilver.htm" target="_blank">Prof. Pamela Silver, Harden Conference 2011</a></h3>'
| + | |
- | pausecontent[3]='<h2>"The technology you are describing is indeed promising. However, I also forsee some hurdles which need to be taken into account, such as legislation and acceptance by the consumer."</h2><h3><a href="https://2011.igem.org/Team:Imperial_College_London/Human_Overview" target="_blank">Dr. Frans Tetteroo, Senior Scientist at Incotec</a></h3>'
| + | |
- | pausecontent[4]='<h2>"I was really impressed with your project, its really cool how you have so many modules built into one system"</h2><h3><a href="http://igemwatch.net/?p=80" target="_blank">Lars Christian, iGEM Watch</a></h3>'
| + | |
- | | + | |
- | </script> | + | |
- | | + | |
- | <script type="text/javascript">
| + | |
| | | |
| + | <script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/magnifier?action=raw&ctype=text/js"> |
| /*********************************************** | | /*********************************************** |
- | * Pausing up-down scroller- © Dynamic Drive (www.dynamicdrive.com) | + | * jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com) |
| * This notice MUST stay intact for legal use | | * This notice MUST stay intact for legal use |
- | * Visit http://www.dynamicdrive.com/ for this script and 100s more. | + | * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more |
| ***********************************************/ | | ***********************************************/ |
| + | <script type="text/javascript"> |
| + | var $ = jQuery; |
| + | jQuery.imageMagnify.zIndexcounter = 1000; |
| + | </script> |
| | | |
- | function pausescroller(content, divId, divClass, delay){
| + | <script> |
- | this.content=content //message array content
| + | $(document).ready(function() { |
- | this.tickerid=divId //ID of ticker div to display information
| + | $("sup").click(function () { |
- | this.delay=delay //Delay between msg change, in miliseconds.
| + | if ($(this).html().substr(0,1)=="[") |
- | 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
| + | if ($('.technology').length>0) |
- | 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
| + | ddaccordion.expandone('technology', $('.technology').length-1) |
- | if (window.addEventListener) //run onload in DOM2 browsers
| + | setTimeout("window.scrollBy(0,50000)",200) |
- | window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
| + | } |
- | else if (window.attachEvent) //run onload in IE5.5+
| + | else window.scrollBy(0,50000) |
- | 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)
| + | $("sup").mouseover(function () { |
- | }
| + | if ($(this).html().substr(0,1)=="[") $(this).css('cursor', 'pointer'); |
- | | + | }); |
- | // -------------------------------------------------------------------
| + | }); |
- | // initialize()- Initialize scroller method.
| + | </script> |
- | // -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)
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | // -------------------------------------------------------------------
| + | |
- | // animateup()- Move the two inner divs of the scroller up and in sync
| + | |
- | // -------------------------------------------------------------------
| + | |
- | | + | |
- | 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)
| + | |
- | } | + | |
- | else{ | + | |
- | this.getinline(this.hiddendiv, this.visiblediv)
| + | |
- | this.swapdivs()
| + | |
- | setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
| + | |
- | } | + | |
- | }
| + | |
- | | + | |
- | // -------------------------------------------------------------------
| + | |
- | // swapdivs()- Swap between which is the visible and which is the hidden div
| + | |
- | // -------------------------------------------------------------------
| + | |
- | | + | |
- | pausescroller.prototype.swapdivs=function(){
| + | |
- | var tempcontainer=this.visiblediv
| + | |
- | this.visiblediv=this.hiddendiv
| + | |
- | this.hiddendiv=tempcontainer
| + | |
- | }
| + | |
- | | + | |
- | pausescroller.prototype.getinline=function(div1, div2){
| + | |
- | div1.style.top=this.visibledivtop+"px"
| + | |
- | div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
| + | |
- | }
| + | |
- | | + | |
- | // -------------------------------------------------------------------
| + | |
- | // setmessage()- Populate the hidden div with the next message before it's visible
| + | |
- | // -------------------------------------------------------------------
| + | |
- | | + | |
- | 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()
| + | |
- | } | + | |
- | } | + | |
- | | + | |
- | pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
| + | |
- | if (tickerobj.currentStyle)
| + | |
- | return tickerobj.currentStyle["paddingTop"]
| + | |
- | else if (window.getComputedStyle) //if DOM2
| + | |
- | return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
| + | |
- | else
| + | |
- | return 0
| + | |
- | }
| + | |
| | | |
| + | <script> |
| + | |
| + | $(document).ready(function() { |
| + | $('ul.sf-menu').superfish({ |
| + | }); |
| + | }); |
| + | |
| </script> | | </script> |
| | | |
- | | + | </head> |
- | <script src="https://2011.igem.org/Team:Imperial_College_London/swfobject?action=raw&ctype=text/js" type="text/javascript"></script>
| + | |
- | <script src="https://2011.igem.org/Team:Imperial_College_London/flashgallery?action=raw&ctype=text/js" type="text/javascript"></script>
| + | |
- | | + | |
- | | + | |
- | </head> | + | |
| | | |
| <body> | | <body> |
- | | + | <div id='menucontainer'> |
- | <table width="975px"> | + | <ul class="sf-menu sf-navbar"> |
- | <tr style="text-align:center;" valign="top"> | + | <li> |
- | <td style="width:650px;"> | + | <a class="sf-with-ul" href="#">Project AuxIn<span class="sf-sub-indicator"> »</span></a> |
- | <p>If you cannot view the photo gallery below, please click <a href="https://2011.igem.org/Team:Imperial_College_London/Alternative"><b>here</b></a> to view our alternative home page or download the Adobe Flash Player <a href="http://www.adobe.com/support/flashplayer/downloads.html" target="_blank"><b>here</b></a>.</p> | + | <ul> |
- | <div style="margin-left:20px;"> | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London">Home</a></li> |
- | <script type="text/javascript"> jQuery.flashgallery('https://static.igem.org/mediawiki/2011/c/c0/ArtGallery.swf ', 'https://2011.igem.org/Team:Imperial_College_London/gallery?action=raw&ctype=text/xml ', {width: '630px', height: '550px', background: '#000000'}); | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Tour">At a Glance</a></li> |
- | </script> | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Project/Background">The Problem</a></li> |
- | | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Project_Chemotaxis_Overview">M1: Phyto-Route</a></li> |
- | <div style="font-size:7pt">©copyright <a href="http://flash-gallery.com" target="_blank" title="Flash-Gallery.com - Art Photo Gallery free version">Flash Slideshow by Flash-Gallery.com</a> </div> | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Project_Auxin_Overview">M2: Auxin Xpress</a></li> |
- | <div style="padding-top:20px"> </div> | + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Project_Gene_Overview">M3: Gene Guard</a></li> |
| + | </ul> |
| + | </li> |
| + | <li> |
| + | <a class="sf-with-ul" href="#">Achievements<span class="sf-sub-indicator"> »</span></a> |
| + | <ul> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Achievements">Main Results</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Data">Data</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Judging">Judging Criteria</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Europe_Jamboree">Europe Jamboree</a></li> |
| + | </ul> |
| + | </li> |
| + | <li> |
| + | <a class="sf-with-ul" href="#">Human Practice<span class="sf-sub-indicator"> »</span></a> |
| + | <ul> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Human_Overview">Informing Design</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Safety">Safety</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Human/Outreach">Outreach</a></li> |
| + | </ul> |
| + | </li> |
| + | <li> |
| + | <a class="sf-with-ul" href="#">Extras<span class="sf-sub-indicator"> »</span></a> |
| + | <ul> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Extras/Collaboration">Collaboration</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Protocols_General">Protocols</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Software">Software</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Notebook/week1">Diary</a></li> |
| + | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Brainstorming_Health">Brainstorming</a></li> |
| + | </ul> |
| + | </li> |
| + | <li> |
| + | <a href="https://2011.igem.org/Team:Imperial_College_London/Team">Team</a> |
| + | </li> |
| + | </ul> |
| </div> | | </div> |
- | </td> | + | <p><br/><br/></p> |
- | | + | |
- | <td>
| + | |
- | | + | |
- | <a href="https://2011.igem.org/Team:Imperial_College_London/Tour"><img src="https://static.igem.org/mediawiki/2011/b/ba/ICL_btn1.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
| + | |
- | <a href="https://2011.igem.org/Team:Imperial_College_London/Achievements"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_btn3.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
| + | |
- | <a href="https://2011.igem.org/Team:Imperial_College_London/Data"><img src="https://static.igem.org/mediawiki/2011/f/f1/ICL_btn2.png" width="250px" style="padding:0px 0px 10px 0px;" /></a>
| + | |
- | | + | |
- | <h2 style="padding-left:0px;">Follow us on</h2>
| + | |
- | <a href="http://www.flickr.com/photos/64732447@N05/" target="_new" alt="Flickr"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_flickr.png" /></a>
| + | |
- | <a href="http://twitter.com/#!/ImperialiGEM11" target="_new" alt="Twitter"><img src="https://static.igem.org/mediawiki/2011/d/d7/ICL_twitter.png" /></a>
| + | |
- | <a href="http://imperialigem.blogspot.com/" target="_new" alt="Blog"><img src="https://static.igem.org/mediawiki/2011/7/7d/ICL_blogger.png" /></a>
| + | |
- | <a href="http://www.youtube.com/user/ImperialiGEM" target="_new" alt="Youtube"><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" alt="Radio iGEM"><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> | + | |
- | | + | |
- | </td>
| + | |
- | </tr>
| + | |
- | </table>
| + | |
- | | + | |
- | <table width="975px">
| + | |
- | <tr>
| + | |
- | <td style="padding:0px 0px 0px 18px;">
| + | |
- | | + | |
- | <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>
| + | |
- | | + | |
- | <br/>
| + | |
- | <h1>Sponsored by:</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> | | </body> |
| </html> | | </html> |