|
|
(6 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 type="text/css">
| |
- | <!--
| |
- |
| |
- | /* 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}); |