Team:UT Dallas/test haccordian

From 2012.igem.org

(Difference between revisions)
 
(47 intermediate revisions not shown)
Line 8: Line 8:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>
-
<script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex17/haccordion.js"></script>
+
<script type="text/javascript" src="https://2012.igem.org/Team:UT_Dallas/haccordion.js?action=raw&ctype=text/javascript"></script>
<script type='text/javascript' src='https://2012.igem.org/Team:UT_Dallas/script.js?action=raw&ctype=text/javascript'></script>
<script type='text/javascript' src='https://2012.igem.org/Team:UT_Dallas/script.js?action=raw&ctype=text/javascript'></script>
<link href="https://2012.igem.org/Team:UT_Dallas/test/page.css?action=raw&ctype=text/css&pu=khhkhhyw" rel="stylesheet">
<link href="https://2012.igem.org/Team:UT_Dallas/test/page.css?action=raw&ctype=text/css&pu=khhkhhyw" rel="stylesheet">
-
<link href="http://www.dynamicdrive.com/dynamicindex17/haccordion.css" rel="stylesheet">
 
</script>
</script>
<style type="text/css">
<style type="text/css">
-
/*CSS for example Accordion #hc2*/
+
 
 +
.haccordion{
 +
padding: 0;
 +
}
 +
 
 +
.haccordion ul{
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
overflow: hidden; /*leave as is*/
 +
}
 +
 
 +
 
 +
.haccordion li{
 +
margin: 0;
 +
padding: 0;
 +
display: block; /*leave as is*/
 +
width: 100%; /*For users with JS disabled: Width of each content*/
 +
height: 200px; /*For users with JS disabled: Height of each content*/
 +
overflow: hidden; /*leave as is*/
 +
float: left; /*leave as is*/
 +
}
 +
 
 +
.haccordion li .hpanel{
 +
width: 100%; /*For users with JS disabled: Width of each content*/
 +
height: 200px;  /*For users with JS disabled: Height of each content*/
 +
}
 +
 
#hc2{
#hc2{
float:right;
float:right;
 +
position:absolute;z-index:999;
}
}
#hc2 li{
#hc2 li{
margin:0 0 0 0; /*Spacing between each LI container*/
margin:0 0 0 0; /*Spacing between each LI container*/
-
border: 5px solid black;
+
border: 1px solid black;
}
}
#hc2 li .hpanel{
#hc2 li .hpanel{
-
padding: 5px; /*Padding inside each content*/
+
padding-left: 55px;  
-
background: #E2E9FF;
+
padding-right: 2px;
 +
padding-top: 2px;
 +
padding-bottom: 2px;  
cursor: hand;
cursor: hand;
cursor: pointer;
cursor: pointer;
Line 36: Line 65:
haccordion.setup({
haccordion.setup({
accordionid: 'hc2', //main accordion div id
accordionid: 'hc2', //main accordion div id
-
paneldimensions: {peekw:'30px', fullw:'450px', h:'150px'},
+
paneldimensions: {peekw:'40px', fullw:'785px', h:'180px'},
-
selectedli: [-1, true],
+
selectedli: [-1, true], //[selectedli_index, persiststate_bool]
-
collapsecurrent: true
+
collapsecurrent: true //<- No comma following very last setting!
})
})
-
 
</script>
</script>
</html>
</html>
Line 47: Line 75:
</div>
</div>
<div id='middle_box'>
<div id='middle_box'>
-
<div id='st_1'><h2 class='title'>Distributed Cellular Processing Units: a synergistic approach to biological computing</h2>
+
<table border='0' width="100%">
-
The goal of the 2012 University of Texas at Dallas IGEM team is to redefine biological information processing using quorum signaling-based biological circuitry in bacteria. Quorum signaling allows bacteria to communicate with each other through the use of chemical signals. Bacteria use this form of signaling in nature to coordinate their behavior. Using three quorum signaling molecules we create unique connections between different populations of engineered bacteria and perform coordinated computing functions. We design and characterize standard and novel modules such as toggle switches, oscillators, signal propagators, and logic gates. As compared to engineering molecular circuitry in single populations, we aim to show that the synergistic approach to information processing leads to improved, scalable, and tunable operation.
+
<tr>
-
</div>
+
<td width="170px" valign='top'>
-
 
+
<div id="hc2" class="haccordion">
<div id="hc2" class="haccordion">
<ul>
<ul>
-
<li style="border-right-width:0">
+
<li style="background:url('https://static.igem.org/mediawiki/2012/d/dc/Toggle_switch.png') no-repeat scroll 0 0 #EEEEEE;border-right-width:0">
-
<div class="hpanel" style="padding:5px; width:700px">
+
<div class="hpanel">
-
This accordion content has a custom full width of 250px. Note where the two inline CSS are added within the markup.
+
Toggle switch
</div>
</div>
</li>
</li>
-
<li style="border-right-width:0">
+
<li style="background:url('https://static.igem.org/mediawiki/2012/b/b7/Oscillator.png') no-repeat scroll 0 0 #EEEEEE;border-right-width:0">
-
<div class="hpanel" style="padding:5px; width:180px">
+
<div class="hpanel">
-
This accordion content has a custom full width of 180px. Note where the two inline CSS are added within the markup.
+
oscillator
</div>
</div>
</li>
</li>
-
<li style="border-right-width:0">
+
<li style="background:url('https://static.igem.org/mediawiki/2012/d/de/And_gate.png') no-repeat scroll 0 0 #EEEEEE;border-right-width:0">
-
<div class="hpanel" style="padding:5px; width:350px">
+
<div class="hpanel">
-
This accordion content has a custom full width of 350px. Note where the two inline CSS are added within the markup.
+
AND gate
</div>
</div>
</li>
</li>
-
<li>
+
<li style="background:url('https://static.igem.org/mediawiki/2012/4/44/Infographics.png') no-repeat scroll 0 0 #EEEEEE;border-right-width:1px">
-
<div class="hpanel" style="padding:5px; width:550px">
+
<div class="hpanel">
-
This accordion content has a custom full width of 550px. Note where the two inline CSS are added within the markup.
+
Infographics
</div>
</div>
</li>
</li>
Line 80: Line 107:
</ul>
</ul>
</div>
</div>
 +
</td>
 +
<td>
 +
<div id='st_1'><h2 class='title'>Distributed Cellular Processing Units: a synergistic approach to biological computing</h2>
 +
The goal of the 2012 University of Texas at Dallas IGEM team is to redefine biological information processing using quorum signaling-based biological circuitry in bacteria. Quorum signaling allows bacteria to communicate with each other through the use of chemical signals. Bacteria use this form of signaling in nature to coordinate their behavior. Using three quorum signaling molecules we create unique connections between different populations of engineered bacteria and perform coordinated computing functions. We design and characterize standard and novel modules such as toggle switches, oscillators, signal propagators, and logic gates. As compared to engineering molecular circuitry in single populations, we aim to show that the synergistic approach to information processing leads to improved, scalable, and tunable operation.
 +
</div>
 +
</td></tr></table>
</div>
</div>
</html>
</html>

Latest revision as of 01:59, 27 September 2012

  • Toggle switch
  • oscillator
  • AND gate
  • Infographics

Distributed Cellular Processing Units: a synergistic approach to biological computing

The goal of the 2012 University of Texas at Dallas IGEM team is to redefine biological information processing using quorum signaling-based biological circuitry in bacteria. Quorum signaling allows bacteria to communicate with each other through the use of chemical signals. Bacteria use this form of signaling in nature to coordinate their behavior. Using three quorum signaling molecules we create unique connections between different populations of engineered bacteria and perform coordinated computing functions. We design and characterize standard and novel modules such as toggle switches, oscillators, signal propagators, and logic gates. As compared to engineering molecular circuitry in single populations, we aim to show that the synergistic approach to information processing leads to improved, scalable, and tunable operation.