|
|
Line 18: |
Line 18: |
| | | |
| <div id="fixiert" onload="moveToAbsolute(775px, 200px)" onresize="moveToAbsolute(775px, 200px)"> | | <div id="fixiert" onload="moveToAbsolute(775px, 200px)" onresize="moveToAbsolute(775px, 200px)"> |
- | <div id="basic-accordian" >
| + | |
- | <div id="test-header" class="accordion_headings header_highlight" > | + | <li style=" margin-left:10px;"><b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Planing">Planning and Development</a></b> |
- | <b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Planing">Planning and Development</a></b></div> | + | |
- | <div id="test-content">
| + | |
| <ul> | | <ul> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#01/07/2012">01/07/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#01/07/2012">01/07/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#01/21/2012">01/21/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#01/21/2012">01/21/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/04/2012">02/04/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/04/2012">02/04/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/06/2012">02/06/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/06/2012">02/06/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/19/2012">02/19/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/19/2012">02/19/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/02/2012">06/02/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/02/2012">06/02/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/09/2012">06/09/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/09/2012">06/09/2012</a></li> |
| </ul> | | </ul> |
- | </div> | + | </li> |
- | <div id="test1-header" class="accordion_headings"> | + | <li style=" margin-left:10px;"><b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Construction">Biosensor-Construction</a></b> |
- | <b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Construction">Biosensor-Construction</a></b></div> | + | |
- | <div id="test1-content">
| + | |
| <ul> | | <ul> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/23/2012">02/23/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/23/2012">02/23/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/24/2012">02/24/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/24/2012">02/24/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/25/2012">02/25/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#02/25/2012">02/25/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/10/2012">03/10/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/10/2012">03/10/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/13/2012">03/13/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/13/2012">03/13/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/14/2012">03/14/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/14/2012">03/14/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/14/2012">03/14/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/14/2012">03/14/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/16/2012">03/16/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/16/2012">03/16/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/17/2012">03/17/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#03/17/2012">03/17/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/08/2012">05/08/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/08/2012">05/08/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/26/2012">05/26/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/26/2012">05/26/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/07/2012">06/07/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#06/07/2012">06/07/2012</a></li> |
| </ul> | | </ul> |
- | </div>
| + | </li> |
- | <div id="test2-header" class="accordion_headings" > | + | <li style=" margin-left:10px;"><b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Calibration">Calibration and Charatcterization</a></b> |
- | <b><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook-Calibration">Calibration and Charatcterization</a></b></div> | + | |
- | <div id="test2-content">
| + | |
| <ul> | | <ul> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/27/2012">04/27/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/27/2012">04/27/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/28/2012">04/28/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/28/2012">04/28/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/29/2012">04/29/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#04/29/2012">04/29/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/27/2012">05/27/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/27/2012">05/27/2012</a></li> |
- | <div class="accordion_child"><li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/28/2012">05/28/2012</a></li></div> | + | <li><a href="http://2012HS.igem.org/Team:Heidelberg_LSL/Notebook#05/28/2012">05/28/2012</a></li> |
| </ul> | | </ul> |
| </div> | | </div> |
Line 79: |
Line 74: |
| | | |
| <style type="text/css"> | | <style type="text/css"> |
- |
| |
- | * {
| |
- | margin:0;
| |
- | padding:0;
| |
- | list-style:none;
| |
- |
| |
- | #basic-accordian{
| |
- | border:5px solid #EEE;
| |
- | padding:5px;
| |
- | width:350px;
| |
- | position:absolute;
| |
- | left:50%;
| |
- | top:50%;
| |
- | margin-left:-175px;
| |
- | z-index:2;
| |
- | margin-top:-100px;
| |
- | }
| |
- |
| |
- | .accordion_headings{
| |
- | padding:5px;
| |
- | background:#99CC00;
| |
- | color:#FFFFFF;
| |
- | border:1px solid #FFF;
| |
- | cursor:pointer;
| |
- | font-weight:bold;
| |
- | }
| |
- |
| |
- | .accordion_headings:hover{
| |
- | background:#00CCFF;
| |
- | }
| |
- |
| |
- | .accordion_child{
| |
- | padding:15px;
| |
- | background:#EEE;
| |
- | }
| |
- |
| |
- | .header_highlight{
| |
- | background:#00CCFF;
| |
- | }
| |
- |
| |
- | p {
| |
- | margin: 3em 0 0 3em; /* Positionierung des 'zurueck'-Links */
| |
- | }
| |
- | p a {
| |
- | color:black; /* Farbe des 'zurueck'-Links */
| |
- | }
| |
- |
| |
- | html {
| |
- | padding: 0;
| |
- | }
| |
- | body {
| |
- | margin: 0; padding: 0;
| |
- | }
| |
- |
| |
| #fixiert { | | #fixiert { |
| position: absolute; | | position: absolute; |
Line 171: |
Line 112: |
| } | | } |
| | | |
- | /* Überwachung von Netscape initialisieren */
| + | |
| if (!window.Weite && window.innerWidth) { | | if (!window.Weite && window.innerWidth) { |
| window.onresize = neuAufbau; | | window.onresize = neuAufbau; |
| Weite = Fensterweite(); | | Weite = Fensterweite(); |
| Hoehe = Fensterhoehe(); | | Hoehe = Fensterhoehe(); |
- | }
| |
- |
| |
- |
| |
- | function $(d){
| |
- | return document.getElementById(d);
| |
- | }
| |
- |
| |
- | // set or get the current display style of the div
| |
- | function dsp(d,v){
| |
- | if(v==undefined){
| |
- | return d.style.display;
| |
- | }else{
| |
- | d.style.display=v;
| |
- | }
| |
- | }
| |
- |
| |
- | // set or get the height of a div.
| |
- | function sh(d,v){
| |
- | // if you are getting the height then display must be block to return the absolute height
| |
- | if(v==undefined){
| |
- | if(dsp(d)!='none'&& dsp(d)!=''){
| |
- | return d.offsetHeight;
| |
- | }
| |
- | viz = d.style.visibility;
| |
- | d.style.visibility = 'hidden';
| |
- | o = dsp(d);
| |
- | dsp(d,'block');
| |
- | r = parseInt(d.offsetHeight);
| |
- | dsp(d,o);
| |
- | d.style.visibility = viz;
| |
- | return r;
| |
- | }else{
| |
- | d.style.height=v;
| |
- | }
| |
- | }
| |
- | /*
| |
- | * Variable 'S' defines the speed of the accordian
| |
- | * Variable 'T' defines the refresh rate of the accordian
| |
- | */
| |
- | s=7;
| |
- | t=10;
| |
- |
| |
- | //Collapse Timer is triggered as a setInterval to reduce the height of the div exponentially.
| |
- | function ct(d){
| |
- | d = $(d);
| |
- | if(sh(d)>0){
| |
- | v = Math.round(sh(d)/d.s);
| |
- | v = (v<1) ? 1 :v ;
| |
- | v = (sh(d)-v);
| |
- | sh(d,v+'px');
| |
- | d.style.opacity = (v/d.maxh);
| |
- | d.style.filter= 'alpha(opacity='+(v*100/d.maxh)+');';
| |
- | }else{
| |
- | sh(d,0);
| |
- | dsp(d,'none');
| |
- | clearInterval(d.t);
| |
- | }
| |
- | }
| |
- |
| |
- | //Expand Timer is triggered as a setInterval to increase the height of the div exponentially.
| |
- | function et(d){
| |
- | d = $(d);
| |
- | if(sh(d)<d.maxh){
| |
- | v = Math.round((d.maxh-sh(d))/d.s);
| |
- | v = (v<1) ? 1 :v ;
| |
- | v = (sh(d)+v);
| |
- | sh(d,v+'px');
| |
- | d.style.opacity = (v/d.maxh);
| |
- | d.style.filter= 'alpha(opacity='+(v*100/d.maxh)+');';
| |
- | }else{
| |
- | sh(d,d.maxh);
| |
- | clearInterval(d.t);
| |
- | }
| |
- | }
| |
- |
| |
- | // Collapse Initializer
| |
- | function cl(d){
| |
- | if(dsp(d)=='block'){
| |
- | clearInterval(d.t);
| |
- | d.t=setInterval('ct("'+d.id+'")',t);
| |
- | }
| |
- | }
| |
- |
| |
- | //Expand Initializer
| |
- | function ex(d){
| |
- | if(dsp(d)=='none'){
| |
- | dsp(d,'block');
| |
- | d.style.height='0px';
| |
- | clearInterval(d.t);
| |
- | d.t=setInterval('et("'+d.id+'")',t);
| |
- | }
| |
- | }
| |
- |
| |
- | // Removes Classname from the given div.
| |
- | function cc(n,v){
| |
- | s=n.className.split(/\s+/);
| |
- | for(p=0;p<s.length;p++){
| |
- | if(s[p]==v+n.tc){
| |
- | s.splice(p,1);
| |
- | n.className=s.join(' ');
| |
- | break;
| |
- | }
| |
- | }
| |
- | }
| |
- | //Accordian Initializer
| |
- | function Accordian(d,s,tc){
| |
- | // get all the elements that have id as content
| |
- | l=$(d).getElementsByTagName('div');
| |
- | c=[];
| |
- | for(i=0;i<l.length;i++){
| |
- | h=l[i].id;
| |
- | if(h.substr(h.indexOf('-')+1,h.length)=='content'){c.push(h);}
| |
- | }
| |
- | sel=null;
| |
- | //then search through headers
| |
- | for(i=0;i<l.length;i++){
| |
- | h=l[i].id;
| |
- | if(h.substr(h.indexOf('-')+1,h.length)=='header'){
| |
- | d=$(h.substr(0,h.indexOf('-'))+'-content');
| |
- | d.style.display='none';
| |
- | d.style.overflow='hidden';
| |
- | d.maxh =sh(d);
| |
- | d.s=(s==undefined)? 7 : s;
| |
- | h=$(h);
| |
- | h.tc=tc;
| |
- | h.c=c;
| |
- | // set the onclick function for each header.
| |
- | h.onclick = function(){
| |
- | for(i=0;i<this.c.length;i++){
| |
- | cn=this.c[i];
| |
- | n=cn.substr(0,cn.indexOf('-'));
| |
- | if((n+'-header')==this.id){
| |
- | ex($(n+'-content'));
| |
- | n=$(n+'-header');
| |
- | cc(n,'__');
| |
- | n.className=n.className+' '+n.tc;
| |
- | }else{
| |
- | cl($(n+'-content'));
| |
- | cc($(n+'-header'),'');
| |
- | }
| |
- | }
| |
- | }
| |
- | if(h.className.match(/selected+/)!=undefined){ sel=h;}
| |
- | }
| |
- | }
| |
- | if(sel!=undefined){sel.onclick();}
| |
| } | | } |
| </script> | | </script> |