Difference between revisions of "Team:UMaryland/buildingwithbiology"
| Line 318: | Line 318: | ||
} | } | ||
| − | #table-selector1 th, #table-selector2 { | + | #table-selector1 th, #table-selector2 th { |
/* makes each cell of nav evenly spaced */ | /* makes each cell of nav evenly spaced */ | ||
text-align: center; | text-align: center; | ||
| Line 338: | Line 338: | ||
#table-selector2 th p { | #table-selector2 th p { | ||
| − | font-size: | + | font-size: 14pt; |
} | } | ||
| Line 603: | Line 603: | ||
<table id="table-selector2"> <!-- Table of navigational links --> | <table id="table-selector2"> <!-- Table of navigational links --> | ||
<thead> | <thead> | ||
| − | <th class="borderRight | + | <th class="borderRight belowNav" id="th-super" data-select="super"><p>Super Organisms!</p></th> |
| − | <th class="borderBoth | + | <th class="borderBoth belowNav" id="th-parts" data-select="parts"><p>Kit of Parts</p></th> |
| − | <th class="borderBoth | + | <th class="borderBoth belowNav" id="th-bistro" data-select="bistro"><p>Bio Bistro</p></th> |
| − | <th class="borderLeft | + | <th class="borderLeft belowNav" id="th-tech" data-select="tech"><p>Tech Tokens</p></th> |
</thead> | </thead> | ||
</table> | </table> | ||
| Line 613: | Line 613: | ||
<table id="table-selector2"> <!-- Table of navigational links --> | <table id="table-selector2"> <!-- Table of navigational links --> | ||
<thead> | <thead> | ||
| − | <th class="borderRight | + | <th class="borderRight belowNav" id="th-bacteria" data-select="bacteria"><p>Build Your Own Bacteria</p></th> |
| − | <th class="borderBoth | + | <th class="borderBoth belowNav" id="th-broth" data-select="broth"><p>Make Your Own LB Broth</p></th> |
| − | <th class="borderLeft | + | <th class="borderLeft belowNav" id="th-color" data-select="color"><p>Colorful Creations</p></th> |
</thead> | </thead> | ||
</table> | </table> | ||
| Line 782: | Line 782: | ||
<script> | <script> | ||
var current = 'super'; // sets initial display to be purpose | var current = 'super'; // sets initial display to be purpose | ||
| + | var currentTop = 'building'; // sets initial display to be purpose | ||
$('.navigator').click( function() { // when any element with .class is clicked, trigger function | $('.navigator').click( function() { // when any element with .class is clicked, trigger function | ||
$('.navigator').css('border-bottom','none'); // make all navigational element shave no bottom border | $('.navigator').css('border-bottom','none'); // make all navigational element shave no bottom border | ||
| Line 792: | Line 793: | ||
$('#div-' + selected).animate({ marginLeft: '0px'}, 200); // the text is animated to quickly move left | $('#div-' + selected).animate({ marginLeft: '0px'}, 200); // the text is animated to quickly move left | ||
current = selected; // sets the current display | current = selected; // sets the current display | ||
| + | } | ||
| + | }) | ||
| + | $('.belowNav').click( function() { // when any element with .class is clicked, trigger function | ||
| + | $('.belowNav').css('border-bottom','none'); // make all navigational element shave no bottom border | ||
| + | $(this).css('border-bottom', '4px solid #A8A8A8'); // the clicked navigational element given border | ||
| + | var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked | ||
| + | if (selected != currentTop) { // only change display / trigger animation if clicking different nav | ||
| + | $('#div-' + currentTop).css('display','none'); // hides all text | ||
| + | $('#div-' + selected).css('margin-left', '60px') // slighly shifts right all text to set up for animation | ||
| + | $('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed | ||
| + | $('#div-' + selected).animate({ marginLeft: '0px'}, 200); // the text is animated to quickly move left | ||
| + | currentTop = selected; // sets the current display | ||
} | } | ||
}) | }) | ||
Revision as of 19:55, 2 August 2016
</div></div>
Building with Biology: Port Discovery
July 30th, 2016
We volunteered at the Building with Biology Event held at Port Discovery in Baltimore, Md to raise awareness about synthetic biology among children 8 and up. We manned six tables with different activities involving synthetic biology, which are described in more depth below.
Building with Biology Activities |
Our Activities |
|---|
Super Organisms! |
Kit of Parts |
Bio Bistro |
Tech Tokens |
|---|
superhero station
Goal: Understand the concept of standardized parts and potential uses of a engineered organism
Activity:
bio bistro
tech tokens
build your own bacteria
lemonade
food color
