Team:Imperial College/Templates/tabs

From 2013.igem.org

(Difference between revisions)
 
(5 intermediate revisions not shown)
Line 1: Line 1:
 +
{{:Team:Imperial_College/Templates:header}}
<html>
<html>
-
<script type="text/javascript">
 
-
(function(){if(typeof Spry=="undefined")window.Spry={};if(!Spry.Widget)Spry.Widget={};Spry.Widget.CollapsiblePanel=function(element,opts){this.element=this.getElement(element);this.focusElement=null;this.hoverClass="CollapsiblePanelTabHover";this.openClass="CollapsiblePanelOpen";this.closedClass="CollapsiblePanelClosed";this.focusedClass="CollapsiblePanelFocused";this.enableAnimation=true;this.enableKeyboardNavigation=true;this.animator=null;this.hasFocus=false;this.contentIsOpen=true;this.openPanelKeyCode=Spry.Widget.CollapsiblePanel.KEY_DOWN;this.closePanelKeyCode=Spry.Widget.CollapsiblePanel.KEY_UP;Spry.Widget.CollapsiblePanel.setOptions(this,opts);this.attachBehaviors();};Spry.Widget.CollapsiblePanel.prototype.getElement=function(ele){if(ele&&typeof ele=="string")return document.getElementById(ele);return ele;};Spry.Widget.CollapsiblePanel.prototype.addClassName=function(ele,className){if(!ele||!className||(ele.className&&ele.className.search(new RegExp("\\b"+className+"\\b"))!=-1))return;ele.className+=(ele.className?" ":"")+className;};Spry.Widget.CollapsiblePanel.prototype.removeClassName=function(ele,className){if(!ele||!className||(ele.className&&ele.className.search(new RegExp("\\b"+className+"\\b"))==-1))return;ele.className=ele.className.replace(new RegExp("\\s*\\b"+className+"\\b","g"),"");};Spry.Widget.CollapsiblePanel.prototype.hasClassName=function(ele,className){if(!ele||!className||!ele.className||ele.className.search(new RegExp("\\b"+className+"\\b"))==-1)return false;return true;};Spry.Widget.CollapsiblePanel.prototype.setDisplay=function(ele,display){if(ele)ele.style.display=display;};Spry.Widget.CollapsiblePanel.setOptions=function(obj,optionsObj,ignoreUndefinedProps){if(!optionsObj)return;for(var optionName in optionsObj){if(ignoreUndefinedProps&&optionsObj[optionName]==undefined)continue;obj[optionName]=optionsObj[optionName];}};Spry.Widget.CollapsiblePanel.prototype.onTabMouseOver=function(e){this.addClassName(this.getTab(),this.hoverClass);return false;};Spry.Widget.CollapsiblePanel.prototype.onTabMouseOut=function(e){this.removeClassName(this.getTab(),this.hoverClass);return false;};Spry.Widget.CollapsiblePanel.prototype.open=function(){this.contentIsOpen=true;if(this.enableAnimation){if(this.animator)this.animator.stop();this.animator=new Spry.Widget.CollapsiblePanel.PanelAnimator(this,true,{duration:this.duration,fps:this.fps,transition:this.transition});this.animator.start();}else this.setDisplay(this.getContent(),"block");this.removeClassName(this.element,this.closedClass);this.addClassName(this.element,this.openClass);};Spry.Widget.CollapsiblePanel.prototype.close=function(){this.contentIsOpen=false;if(this.enableAnimation){if(this.animator)this.animator.stop();this.animator=new Spry.Widget.CollapsiblePanel.PanelAnimator(this,false,{duration:this.duration,fps:this.fps,transition:this.transition});this.animator.start();}else this.setDisplay(this.getContent(),"none");this.removeClassName(this.element,this.openClass);this.addClassName(this.element,this.closedClass);};Spry.Widget.CollapsiblePanel.prototype.onTabClick=function(e){if(this.isOpen())this.close();else this.open();this.focus();return this.stopPropagation(e);};Spry.Widget.CollapsiblePanel.prototype.onFocus=function(e){this.hasFocus=true;this.addClassName(this.element,this.focusedClass);return false;};Spry.Widget.CollapsiblePanel.prototype.onBlur=function(e){this.hasFocus=false;this.removeClassName(this.element,this.focusedClass);return false;};Spry.Widget.CollapsiblePanel.KEY_UP=38;Spry.Widget.CollapsiblePanel.KEY_DOWN=40;Spry.Widget.CollapsiblePanel.prototype.onKeyDown=function(e){var key=e.keyCode;if(!this.hasFocus||(key!=this.openPanelKeyCode&&key!=this.closePanelKeyCode))return true;if(this.isOpen()&&key==this.closePanelKeyCode)this.close();else if(key==this.openPanelKeyCode)this.open();return this.stopPropagation(e);};Spry.Widget.CollapsiblePanel.prototype.stopPropagation=function(e){if(e.preventDefault)e.preventDefault();else e.returnValue=false;if(e.stopPropagation)e.stopPropagation();else e.cancelBubble=true;return false;};Spry.Widget.CollapsiblePanel.prototype.attachPanelHandlers=function(){var tab=this.getTab();if(!tab)return;var self=this;Spry.Widget.CollapsiblePanel.addEventListener(tab,"click",function(e){return self.onTabClick(e);},false);Spry.Widget.CollapsiblePanel.addEventListener(tab,"mouseover",function(e){return self.onTabMouseOver(e);},false);Spry.Widget.CollapsiblePanel.addEventListener(tab,"mouseout",function(e){return self.onTabMouseOut(e);},false);if(this.enableKeyboardNavigation){var tabIndexEle=null;var tabAnchorEle=null;this.preorderTraversal(tab,function(node){if(node.nodeType==1){var tabIndexAttr=tab.attributes.getNamedItem("tabindex");if(tabIndexAttr){tabIndexEle=node;return true;}if(!tabAnchorEle&&node.nodeName.toLowerCase()=="a")tabAnchorEle=node;}return false;});if(tabIndexEle)this.focusElement=tabIndexEle;else if(tabAnchorEle)this.focusElement=tabAnchorEle;if(this.focusElement){Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement,"focus",function(e){return self.onFocus(e);},false);Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement,"blur",function(e){return self.onBlur(e);},false);Spry.Widget.CollapsiblePanel.addEventListener(this.focusElement,"keydown",function(e){return self.onKeyDown(e);},false);}}};Spry.Widget.CollapsiblePanel.addEventListener=function(element,eventType,handler,capture){try{if(element.addEventListener)element.addEventListener(eventType,handler,capture);else if(element.attachEvent)element.attachEvent("on"+eventType,handler);}catch(e){}};Spry.Widget.CollapsiblePanel.prototype.preorderTraversal=function(root,func){var stopTraversal=false;if(root){stopTraversal=func(root);if(root.hasChildNodes()){var child=root.firstChild;while(!stopTraversal&&child){stopTraversal=this.preorderTraversal(child,func);try{child=child.nextSibling;}catch(e){child=null;}}}}return stopTraversal;};Spry.Widget.CollapsiblePanel.prototype.attachBehaviors=function(){var panel=this.element;var tab=this.getTab();var content=this.getContent();if(this.contentIsOpen||this.hasClassName(panel,this.openClass)){this.addClassName(panel,this.openClass);this.removeClassName(panel,this.closedClass);this.setDisplay(content,"block");this.contentIsOpen=true;}else{this.removeClassName(panel,this.openClass);this.addClassName(panel,this.closedClass);this.setDisplay(content,"none");this.contentIsOpen=false;}this.attachPanelHandlers();};Spry.Widget.CollapsiblePanel.prototype.getTab=function(){return this.getElementChildren(this.element)[0];};Spry.Widget.CollapsiblePanel.prototype.getContent=function(){return this.getElementChildren(this.element)[1];};Spry.Widget.CollapsiblePanel.prototype.isOpen=function(){return this.contentIsOpen;};Spry.Widget.CollapsiblePanel.prototype.getElementChildren=function(element){var children=[];var child=element.firstChild;while(child){if(child.nodeType==1)children.push(child);child=child.nextSibling;}return children;};Spry.Widget.CollapsiblePanel.prototype.focus=function(){if(this.focusElement&&this.focusElement.focus)this.focusElement.focus();};Spry.Widget.CollapsiblePanel.PanelAnimator=function(panel,doOpen,opts){this.timer=null;this.interval=0;this.fps=60;this.duration=500;this.startTime=0;this.transition=Spry.Widget.CollapsiblePanel.PanelAnimator.defaultTransition;this.onComplete=null;this.panel=panel;this.content=panel.getContent();this.doOpen=doOpen;Spry.Widget.CollapsiblePanel.setOptions(this,opts,true);this.interval=Math.floor(1000/this.fps);var c=this.content;var curHeight=c.offsetHeight?c.offsetHeight:0;this.fromHeight=(doOpen&&c.style.display=="none")?0:curHeight;if(!doOpen)this.toHeight=0;else{if(c.style.display=="none"){c.style.visibility="hidden";c.style.display="block";}c.style.height="";this.toHeight=c.offsetHeight;}this.distance=this.toHeight-this.fromHeight;this.overflow=c.style.overflow;c.style.height=this.fromHeight+"px";c.style.visibility="visible";c.style.overflow="hidden";c.style.display="block";};Spry.Widget.CollapsiblePanel.PanelAnimator.defaultTransition=function(time,begin,finish,duration){time/=duration;return begin+((2-time)*time*finish);};Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.start=function(){var self=this;this.startTime=(new Date).getTime();this.timer=setTimeout(function(){self.stepAnimation();},this.interval);};Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.stop=function(){if(this.timer){clearTimeout(this.timer);this.content.style.overflow=this.overflow;}this.timer=null;};Spry.Widget.CollapsiblePanel.PanelAnimator.prototype.stepAnimation=function(){var curTime=(new Date).getTime();var elapsedTime=curTime-this.startTime;if(elapsedTime>=this.duration){if(!this.doOpen)this.content.style.display="none";this.content.style.overflow=this.overflow;this.content.style.height=this.toHeight+"px";if(this.onComplete)this.onComplete();return;}var ht=this.transition(elapsedTime,this.fromHeight,this.distance,this.duration);this.content.style.height=((ht<0)?0:ht)+"px";var self=this;this.timer=setTimeout(function(){self.stepAnimation();},this.interval);};Spry.Widget.CollapsiblePanelGroup=function(element,opts){this.element=this.getElement(element);this.opts=opts;this.attachBehaviors();};Spry.Widget.CollapsiblePanelGroup.prototype.setOptions=Spry.Widget.CollapsiblePanel.prototype.setOptions;Spry.Widget.CollapsiblePanelGroup.prototype.getElement=Spry.Widget.CollapsiblePanel.prototype.getElement;Spry.Widget.CollapsiblePanelGroup.prototype.getElementChildren=Spry.Widget.CollapsiblePanel.prototype.getElementChildren;Spry.Widget.CollapsiblePanelGroup.prototype.setElementWidget=function(element,widget){if(!element||!widget)return;if(!element.spry)element.spry=new Object;element.spry.collapsiblePanel=widget;};Spry.Widget.CollapsiblePanelGroup.prototype.getElementWidget=function(element){return(element&&element.spry&&element.spry.collapsiblePanel)?element.spry.collapsiblePanel:null;};Spry.Widget.CollapsiblePanelGroup.prototype.getPanels=function(){if(!this.element)return[];return this.getElementChildren(this.element);};Spry.Widget.CollapsiblePanelGroup.prototype.getPanel=function(panelIndex){return this.getPanels()[panelIndex];};Spry.Widget.CollapsiblePanelGroup.prototype.attachBehaviors=function(){if(!this.element)return;var cpanels=this.getPanels();var numCPanels=cpanels.length;for(var i=0;i<numCPanels;i++){var cpanel=cpanels[i];this.setElementWidget(cpanel,new Spry.Widget.CollapsiblePanel(cpanel,this.opts));}};Spry.Widget.CollapsiblePanelGroup.prototype.openPanel=function(panelIndex){var w=this.getElementWidget(this.getPanel(panelIndex));if(w&&!w.isOpen())w.open();};Spry.Widget.CollapsiblePanelGroup.prototype.closePanel=function(panelIndex){var w=this.getElementWidget(this.getPanel(panelIndex));if(w&&w.isOpen())w.close();};Spry.Widget.CollapsiblePanelGroup.prototype.openAllPanels=function(){var cpanels=this.getPanels();var numCPanels=cpanels.length;for(var i=0;i<numCPanels;i++){var w=this.getElementWidget(cpanels[i]);if(w&&!w.isOpen())w.open();}};Spry.Widget.CollapsiblePanelGroup.prototype.closeAllPanels=function(){var cpanels=this.getPanels();var numCPanels=cpanels.length;for(var i=0;i<numCPanels;i++){var w=this.getElementWidget(cpanels[i]);if(w&&w.isOpen())w.close();}};})();(function(){if(typeof Spry=="undefined")window.Spry={};if(!Spry.Widget)Spry.Widget={};Spry.Widget.TabbedPanels=function(element,opts){this.element=this.getElement(element);this.defaultTab=0;this.tabSelectedClass="TabbedPanelsTabSelected";this.tabHoverClass="TabbedPanelsTabHover";this.tabFocusedClass="TabbedPanelsTabFocused";this.panelVisibleClass="TabbedPanelsContentVisible";this.focusElement=null;this.hasFocus=false;this.currentTabIndex=0;this.enableKeyboardNavigation=true;this.nextPanelKeyCode=Spry.Widget.TabbedPanels.KEY_RIGHT;this.previousPanelKeyCode=Spry.Widget.TabbedPanels.KEY_LEFT;Spry.Widget.TabbedPanels.setOptions(this,opts);if(typeof(this.defaultTab)=="number"){if(this.defaultTab<0)this.defaultTab=0;else{var count=this.getTabbedPanelCount();if(this.defaultTab>=count)this.defaultTab=(count>1)?(count-1):0;}this.defaultTab=this.getTabs()[this.defaultTab];}if(this.defaultTab)this.defaultTab=this.getElement(this.defaultTab);this.attachBehaviors();};Spry.Widget.TabbedPanels.prototype.getElement=function(ele){if(ele&&typeof ele=="string")return document.getElementById(ele);return ele;};Spry.Widget.TabbedPanels.prototype.getElementChildren=function(element){var children=[];var child=element.firstChild;while(child){if(child.nodeType==1)children.push(child);child=child.nextSibling;}return children;};Spry.Widget.TabbedPanels.prototype.addClassName=function(ele,className){if(!ele||!className||(ele.className&&ele.className.search(new RegExp("\\b"+className+"\\b"))!=-1))return;ele.className+=(ele.className?" ":"")+className;};Spry.Widget.TabbedPanels.prototype.removeClassName=function(ele,className){if(!ele||!className||(ele.className&&ele.className.search(new RegExp("\\b"+className+"\\b"))==-1))return;ele.className=ele.className.replace(new RegExp("\\s*\\b"+className+"\\b","g"),"");};Spry.Widget.TabbedPanels.setOptions=function(obj,optionsObj,ignoreUndefinedProps){if(!optionsObj)return;for(var optionName in optionsObj){if(ignoreUndefinedProps&&optionsObj[optionName]==undefined)continue;obj[optionName]=optionsObj[optionName];}};Spry.Widget.TabbedPanels.prototype.getTabGroup=function(){if(this.element){var children=this.getElementChildren(this.element);if(children.length)return children[0];}return null;};Spry.Widget.TabbedPanels.prototype.getTabs=function(){var tabs=[];var tg=this.getTabGroup();if(tg)tabs=this.getElementChildren(tg);return tabs;};Spry.Widget.TabbedPanels.prototype.getContentPanelGroup=function(){if(this.element){var children=this.getElementChildren(this.element);if(children.length>1)return children[1];}return null;};Spry.Widget.TabbedPanels.prototype.getContentPanels=function(){var panels=[];var pg=this.getContentPanelGroup();if(pg)panels=this.getElementChildren(pg);return panels;};Spry.Widget.TabbedPanels.prototype.getIndex=function(ele,arr){ele=this.getElement(ele);if(ele&&arr&&arr.length){for(var i=0;i<arr.length;i++){if(ele==arr[i])return i;}}return-1;};Spry.Widget.TabbedPanels.prototype.getTabIndex=function(ele){var i=this.getIndex(ele,this.getTabs());if(i<0)i=this.getIndex(ele,this.getContentPanels());return i;};Spry.Widget.TabbedPanels.prototype.getCurrentTabIndex=function(){return this.currentTabIndex;};Spry.Widget.TabbedPanels.prototype.getTabbedPanelCount=function(ele){return Math.min(this.getTabs().length,this.getContentPanels().length);};Spry.Widget.TabbedPanels.addEventListener=function(element,eventType,handler,capture){try{if(element.addEventListener)element.addEventListener(eventType,handler,capture);else if(element.attachEvent)element.attachEvent("on"+eventType,handler);}catch(e){}};Spry.Widget.TabbedPanels.prototype.cancelEvent=function(e){if(e.preventDefault)e.preventDefault();else e.returnValue=false;if(e.stopPropagation)e.stopPropagation();else e.cancelBubble=true;return false;};Spry.Widget.TabbedPanels.prototype.onTabClick=function(e,tab){this.showPanel(tab);return this.cancelEvent(e);};Spry.Widget.TabbedPanels.prototype.onTabMouseOver=function(e,tab){this.addClassName(tab,this.tabHoverClass);return false;};Spry.Widget.TabbedPanels.prototype.onTabMouseOut=function(e,tab){this.removeClassName(tab,this.tabHoverClass);return false;};Spry.Widget.TabbedPanels.prototype.onTabFocus=function(e,tab){this.hasFocus=true;this.addClassName(tab,this.tabFocusedClass);return false;};Spry.Widget.TabbedPanels.prototype.onTabBlur=function(e,tab){this.hasFocus=false;this.removeClassName(tab,this.tabFocusedClass);return false;};Spry.Widget.TabbedPanels.KEY_UP=38;Spry.Widget.TabbedPanels.KEY_DOWN=40;Spry.Widget.TabbedPanels.KEY_LEFT=37;Spry.Widget.TabbedPanels.KEY_RIGHT=39;Spry.Widget.TabbedPanels.prototype.onTabKeyDown=function(e,tab){var key=e.keyCode;if(!this.hasFocus||(key!=this.previousPanelKeyCode&&key!=this.nextPanelKeyCode))return true;var tabs=this.getTabs();for(var i=0;i<tabs.length;i++)if(tabs[i]==tab){var el=false;if(key==this.previousPanelKeyCode&&i>0)el=tabs[i-1];else if(key==this.nextPanelKeyCode&&i<tabs.length-1)el=tabs[i+1];if(el){this.showPanel(el);el.focus();break;}}return this.cancelEvent(e);};Spry.Widget.TabbedPanels.prototype.preorderTraversal=function(root,func){var stopTraversal=false;if(root){stopTraversal=func(root);if(root.hasChildNodes()){var child=root.firstChild;while(!stopTraversal&&child){stopTraversal=this.preorderTraversal(child,func);try{child=child.nextSibling;}catch(e){child=null;}}}}return stopTraversal;};Spry.Widget.TabbedPanels.prototype.addPanelEventListeners=function(tab,panel){var self=this;Spry.Widget.TabbedPanels.addEventListener(tab,"click",function(e){return self.onTabClick(e,tab);},false);Spry.Widget.TabbedPanels.addEventListener(tab,"mouseover",function(e){return self.onTabMouseOver(e,tab);},false);Spry.Widget.TabbedPanels.addEventListener(tab,"mouseout",function(e){return self.onTabMouseOut(e,tab);},false);if(this.enableKeyboardNavigation){var tabIndexEle=null;var tabAnchorEle=null;this.preorderTraversal(tab,function(node){if(node.nodeType==1){var tabIndexAttr=tab.attributes.getNamedItem("tabindex");if(tabIndexAttr){tabIndexEle=node;return true;}if(!tabAnchorEle&&node.nodeName.toLowerCase()=="a")tabAnchorEle=node;}return false;});if(tabIndexEle)this.focusElement=tabIndexEle;else if(tabAnchorEle)this.focusElement=tabAnchorEle;if(this.focusElement){Spry.Widget.TabbedPanels.addEventListener(this.focusElement,"focus",function(e){return self.onTabFocus(e,tab);},false);Spry.Widget.TabbedPanels.addEventListener(this.focusElement,"blur",function(e){return self.onTabBlur(e,tab);},false);Spry.Widget.TabbedPanels.addEventListener(this.focusElement,"keydown",function(e){return self.onTabKeyDown(e,tab);},false);}}};Spry.Widget.TabbedPanels.prototype.showPanel=function(elementOrIndex){var tpIndex=-1;if(typeof elementOrIndex=="number")tpIndex=elementOrIndex;else tpIndex=this.getTabIndex(elementOrIndex);if(!tpIndex<0||tpIndex>=this.getTabbedPanelCount())return;var tabs=this.getTabs();var panels=this.getContentPanels();var numTabbedPanels=Math.max(tabs.length,panels.length);for(var i=0;i<numTabbedPanels;i++){if(i!=tpIndex){if(tabs[i])this.removeClassName(tabs[i],this.tabSelectedClass);if(panels[i]){this.removeClassName(panels[i],this.panelVisibleClass);panels[i].style.display="none";}}}this.addClassName(tabs[tpIndex],this.tabSelectedClass);this.addClassName(panels[tpIndex],this.panelVisibleClass);panels[tpIndex].style.display="block";this.currentTabIndex=tpIndex;};Spry.Widget.TabbedPanels.prototype.attachBehaviors=function(element){var tabs=this.getTabs();var panels=this.getContentPanels();var panelCount=this.getTabbedPanelCount();for(var i=0;i<panelCount;i++)this.addPanelEventListeners(tabs[i],panels[i]);this.showPanel(this.defaultTab);};})();
 
-
</script>
 
-
<style>
 
-
<!--
 
-
 
-
/* Styles for Collapible panels */
 
-
.CollapsiblePanel {
 
-
margin:0px ;
 
-
padding: 0px;
 
-
border-left: solid 0px #CCC;
 
-
border-right: solid 0px #999;
 
-
border-top: solid 0px #999;
 
-
border-bottom: solid 0px #CCC;
 
-
}
 
-
 
-
.CollapsiblePanelTab {
 
-
 
-
background-color: #fff;
 
-
border-bottom: solid 1px #CCC;
 
-
margin: 0px;
 
-
padding: 2px;
 
-
cursor: pointer;
 
-
 
-
}
 
-
 
-
.CollapsiblePanelContent {
 
-
margin: 0px;
 
-
padding: 0px;
 
-
background-color: #FFFFFF;
 
-
}
 
-
 
-
 
-
.CollapsiblePanelTab a {
 
-
color: black;
 
-
text-decoration: none;
 
-
}
 
-
 
-
 
-
.CollapsiblePanelOpen .CollapsiblePanelTab {
 
-
background-color: #FFFFFF;
 
-
}
 
-
.CollapsiblePanelClosed .CollapsiblePanelTab {
 
-
/* background-color: #EFEFEF */
 
-
}
 
-
.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover {
 
-
background-color: #FFFFFF;
 
-
}
 
-
.CollapsiblePanelFocused .CollapsiblePanelTab {
 
-
background-color: #FFFFFF;
 
-
}
 
-
 
-
.TabbedPanels {
 
-
overflow: hidden;
 
-
margin: 0px;
 
-
padding: 0px;
 
-
clear: none;
 
-
width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
 
-
}
 
-
.TabbedPanelsTabGroup {
 
-
margin: 0px;
 
-
padding: 0px;
 
-
}
 
-
.TabbedPanelsTab {
 
-
position: relative;
 
-
top: 1px;
 
-
float: left;
 
-
padding: 4px 10px;
 
-
margin: 0px 1px 0px 0px;
 
-
background-color: #FFFFFF;
 
-
list-style: none;
 
-
border-left: solid 1px #CCC;
 
-
border-bottom: solid 1px #999;
 
-
border-top: solid 1px #999;
 
-
border-right: solid 1px #999;
 
-
-moz-user-select: none;
 
-
-khtml-user-select: none;
 
-
cursor: pointer;
 
-
}
 
-
.TabbedPanelsTabHover {
 
-
background-color: #CCC;
 
-
}
 
-
.TabbedPanelsTabSelected {
 
-
background-color: #FFFFFF;
 
-
border-bottom: 1px solid #EEE;
 
-
}
 
-
.TabbedPanelsTab a {
 
-
color: black;
 
-
text-decoration: none;
 
-
}
 
-
.TabbedPanelsContentGroup {
 
-
clear: both;
 
-
border-left: solid 1px #CCC;
 
-
border-bottom: solid 1px #CCC;
 
-
border-top: solid 1px #999;
 
-
border-right: solid 1px #999;
 
-
background-color: #FFFFFF;
 
-
}
 
-
.TabbedPanelsContent {
 
-
overflow: hidden;
 
-
padding: 4px;
 
-
}
 
-
.TabbedPanelsContentVisible {
 
-
}
 
-
.VTabbedPanels {
 
-
overflow: hidden;
 
-
zoom: 1;
 
-
}
 
-
.VTabbedPanels .TabbedPanelsTabGroup {
 
-
float: left;
 
-
width: 10em;
 
-
height: 20em;
 
-
background-color: #EEE;
 
-
position: relative;
 
-
border-top: solid 1px #999;
 
-
border-right: solid 1px #999;
 
-
border-left: solid 1px #CCC;
 
-
border-bottom: solid 1px #CCC;
 
-
}
 
-
.VTabbedPanels .TabbedPanelsTab {
 
-
float: none;
 
-
margin: 0px;
 
-
border-top: none;
 
-
border-left: none;
 
-
border-right: none;
 
-
}
 
-
.VTabbedPanels .TabbedPanelsTabSelected {
 
-
background-color: #EEE;
 
-
border-bottom: solid 1px #999;
 
-
}
 
-
.VTabbedPanels .TabbedPanelsContentGroup {
 
-
clear: none;
 
-
float: left;
 
-
padding: 0px;
 
-
width: 30em;
 
-
height: 20em;
 
-
}
 
-
 
-
/* Styles for Printing */
 
-
@media print {
 
-
.TabbedPanels {
 
-
overflow: visible !important;
 
-
}
 
-
.TabbedPanelsContentGroup {
 
-
display: block !important;
 
-
overflow: visible !important;
 
-
height: auto !important;
 
-
}
 
-
.TabbedPanelsContent {
 
-
overflow: visible !important;
 
-
display: block !important;
 
-
clear:both !important;
 
-
}
 
-
.TabbedPanelsTab {
 
-
overflow: visible !important;
 
-
display: block !important;
 
-
clear:both !important;
 
-
}
 
-
 
-
 
-
 
-
-->
 
-
</style>
 
<div id="TabbedPanels1" class="TabbedPanels">
<div id="TabbedPanels1" class="TabbedPanels">
Line 176: Line 14:
   </ul>
   </ul>
   <div class="TabbedPanelsContentGroup">
   <div class="TabbedPanelsContentGroup">
-
     <div class="TabbedPanelsContent">Content 1</div>
+
     <div class="TabbedPanelsContent"></html>Content 1 Please note that all contributions to 2013.igem.org are considered to be released under the Attribution 3.0 Unported (see 2013.igem.org:Copyrights for details). If you do not want your writing to be edited mercilessly and '''redistributed'''
-
     <div class="TabbedPanelsContent">Content 3</div>
+
== at will, ==
-
     <div class="TabbedPanelsContent">Content 4</div>
+
then do not submit it here.
-
     <div class="TabbedPanelsContent">Content 5</div>
+
''You are also promising us that you wrote this yourself,'' or copied it from a public domain or similar free resource. Do not submit copyrighted work without permission!
 +
 
 +
<html></div>
 +
     <div class="TabbedPanelsContent">Content 2HELLO</div>
 +
     <div class="TabbedPanelsContent">Content 3
 +
    </div>
 +
     <div class="TabbedPanelsContent">Content 4
 +
    <div id="CollapsiblePanelMod1" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content Hello world</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod2" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod3" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod4" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod5" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod6" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod7" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod8" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod9" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
      <div id="CollapsiblePanelMod10" class="CollapsiblePanel">
 +
        <div class="CollapsiblePanelTab" tabindex="0">Tab</div>
 +
        <div class="CollapsiblePanelContent">Content</div>
 +
      </div>
 +
    </div>
     <div class="TabbedPanelsContent">Content 6</div>
     <div class="TabbedPanelsContent">Content 6</div>
     <div class="TabbedPanelsContent">Content 7
     <div class="TabbedPanelsContent">Content 7
Line 225: Line 110:
<script type="text/javascript">
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
 +
var CollapsiblePanelMod1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod1", {contentIsOpen:false});
 +
var CollapsiblePanelMod2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod2", {contentIsOpen:false});
 +
var CollapsiblePanelMod3 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod3", {contentIsOpen:false});
 +
var CollapsiblePanelMod4 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod4", {contentIsOpen:false});
 +
var CollapsiblePanelMod5 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod5", {contentIsOpen:false});
 +
var CollapsiblePanelMod6 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod6", {contentIsOpen:false});
 +
var CollapsiblePanelMod7 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod7", {contentIsOpen:false});
 +
var CollapsiblePanelMod8 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod8", {contentIsOpen:false});
 +
var CollapsiblePanelMod9 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod9", {contentIsOpen:false});
 +
var CollapsiblePanelMod10 = new Spry.Widget.CollapsiblePanel("CollapsiblePanelMod10", {contentIsOpen:false});
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
var CollapsiblePanel2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel2", {contentIsOpen:false});
var CollapsiblePanel2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel2", {contentIsOpen:false});

Latest revision as of 11:56, 2 October 2013

  • Overview
  • Specifications
  • Design
  • Modelling
  • Assemble
  • Testing & results
  • Future work
Content 1 Please note that all contributions to 2013.igem.org are considered to be released under the Attribution 3.0 Unported (see 2013.igem.org:Copyrights for details). If you do not want your writing to be edited mercilessly and redistributed

at will,

then do not submit it here.

You are also promising us that you wrote this yourself, or copied it from a public domain or similar free resource. Do not submit copyrighted work without permission!

Content 2HELLO
Content 3
Content 4
Tab
Content Hello world
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Content 6
Content 7
Tab
Content Hello world
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Tab
Content
Content 2