Template:UC Chile4

From 2012.igem.org

(Difference between revisions)
(Created page with "{{:Team:Imperial_College_London/Templates/Header}} <html> <head> <style type="text/css"> - →Example CSS for the two demo scrollers: #pscroller1{ width: 930px; height: 120px; b...")
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"> &#187;</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">&copy;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">&nbsp;</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"> &#187;</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"> &#187;</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"> &#187;</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>

Revision as of 23:46, 30 August 2012




Retrieved from "http://2012.igem.org/Template:UC_Chile4"