|
|
| (220 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| − | {{BostonU_we_tryin}}
| |
| − | <html>
| |
| − | <style>
| |
| | | | |
| − | #sideMenu, #top_title {display:none;}
| |
| − | body {background-color:white; }
| |
| − | #content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;}
| |
| − | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
| |
| − |
| |
| − | #one {
| |
| − | position:absolute;
| |
| − | left:10%;
| |
| − | }
| |
| − |
| |
| − | #two {
| |
| − | position:absolute;
| |
| − | left:-110%;
| |
| − | }
| |
| − |
| |
| − | #three {
| |
| − | position:absolute;
| |
| − | left:-110%;
| |
| − | }
| |
| − |
| |
| − | #four {
| |
| − | position:absolute;
| |
| − | left:-110%;
| |
| − | }
| |
| − |
| |
| − | #five {
| |
| − | position:absolute;
| |
| − | left:-110%;
| |
| − | }
| |
| − |
| |
| − | #container {
| |
| − | width:100%;
| |
| − | height:89vh;
| |
| − | position:absolute;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − |
| |
| − | #button {
| |
| − | width:5vw;
| |
| − | height:5vw;
| |
| − | background-color:#0071A7;
| |
| − | border-color:#0071A7;
| |
| − | border-radius:50%;
| |
| − | border-style:solid;
| |
| − | font-size:150%;
| |
| − | color:white;
| |
| − | text-align:center;
| |
| − | position:absolute;
| |
| − | top:70vh;
| |
| − | left:69vw;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | #buttonname {
| |
| − | width:12vw;
| |
| − | height:5vw;
| |
| − | color:#0071A7;
| |
| − | text-align:center;
| |
| − | font-size:175%;
| |
| − | position:absolute;
| |
| − | top:62vh;
| |
| − | left:65vw;
| |
| − | }
| |
| − |
| |
| − | </style>
| |
| − |
| |
| − | <body>
| |
| − | <div id = "container">
| |
| − | <img style = "width:80%; height:89vh;" src = "https://static.igem.org/mediawiki/2016/3/35/T--BostonU--Geminisymbol.jpg" id = "one" class = "show">
| |
| − |
| |
| − | <div style = "width:80%; height:89vh;" id = "two" class = "show">
| |
| − | <br>
| |
| − | <center style = "font-size:280%; font-family:Trebuchet MS; color:#0071A7;">Our Project</center>
| |
| − | <br><center><hr style= "width:702px; height: 3px; background-color:#0071A7"></center>
| |
| − | <center><p style = "width:80%; color:#0071A7; font-size:125%; padding:15px;">In nature, some cells have the ability to detect if certain environmental signals such as hormones, drugs, or wavelengths of light are present or absent. These digital signals can then determine the analog expression level of certain genes. Our project aimed to replicate this natural process through a dCAS9 based system. Our system Gemini is able to recognize the presence (represented by a 1) or the absence (represented by a 0) of several environmental signals and change a gene's level of expression based on what combination of signals it is registering.</p>
| |
| − | <img style = "width:30%; padding:0px 5%;" src = "https://static.igem.org/mediawiki/2016/5/51/T--BostonU--Signals.png">
| |
| − | <img style = "width:20%; padding:0px 5%;" src = "https://static.igem.org/mediawiki/2016/5/59/T--BostonU--digital.png">
| |
| − | </center>
| |
| − | <div id = "buttonname">
| |
| − | <br>
| |
| − | Project Tour
| |
| − | </div>
| |
| − |
| |
| − | <div id = "button">
| |
| − | <div style = "margin:3.75vh 0vh 0vh 0vh;">
| |
| − | <a href="https://2016.igem.org/Team:BostonU/Description" style = "text-align:center; font-size:200%; color:white;">>></a>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div style = "width:80%; height:89vh;" id = "three" class = "show">
| |
| − | <br>
| |
| − | <center style = "font-size:280%; font-family:Trebuchet MS; color:#bd162a;">HP Projects</center>
| |
| − | <br><center><hr style= "width:702px; height: 3px; background-color:#bd162a;"></center>
| |
| − | <center><p style = "width:80%; color:#bd162a; font-size:125%; padding:15px;">In addition to creating Gemini, our team also aimed to go beyond the lab space and contribute to the synthetic biology community in other ways. In addition to volunteering for several outreach programs, we also developed two human practices projects. The first was creating a set of interactive discussion forums meant to make synthetic biology more accessible to the public. The second was a blog intended to inform synthetic biologists about important considerations and implications in patent law and intellectual property.</p>
| |
| − | <img style = "width:30%; padding:2% 5%;" src = "https://static.igem.org/mediawiki/2016/e/e0/T--BostonU--Summer_Pathways.jpg">
| |
| − | <img style = "width:30%; padding:2% 5%;" src = "https://static.igem.org/mediawiki/2016/f/f8/T--BostonU--Forums.jpg">
| |
| − | </center>
| |
| − | </div>
| |
| − |
| |
| − | <div style = "width:80%; height:89vh;" id = "four" class = "show">
| |
| − | <br>
| |
| − | <center style = "font-size:280%; font-family:Trebuchet MS; color:#507f54;">For the Judges</center>
| |
| − | <br><center><hr style= "width:702px; height: 3px; background-color:#507f54;"></center>
| |
| − | <center><img src = "https://static.igem.org/mediawiki/2016/9/9e/T--BostonU--Medals.png" style = "width:70%;"></center>
| |
| − | <p style = "text-align:center; color:#507f54; font-size:175%;">A full list of how we met each medal requirement can be found here:</p></center>
| |
| − | </div>
| |
| − |
| |
| − | <div style = "width:80%; height:89vh;" id = "five" class = "show">
| |
| − | <br>
| |
| − | <center style = "font-size:280%; font-family:Trebuchet MS; color:#0071A7;">Team & Advisors</center>
| |
| − | <br><center><hr style= "width:702px; height: 3px; background-color:#0071A7"></center>
| |
| − | <img src = "" style = "width:100%">
| |
| − | </div>
| |
| − |
| |
| − | </div>
| |
| − |
| |
| − | <div style = "width:10vw; height:89vh; background-color:white; color:blue; text-align:center; font-size:300%; position:absolute; z-index:100; left: 90%; top:50vh;" id = "forward"><div style = "height:3vw"></div>></div>
| |
| − | <div style = "width:10vw; height:89vw; background-color:white; color:blue; text-align:center; font-size:300%; position:absolute; left:-1%; top:50vh; z-index:100;" id = "reverse"><div style = "height:3vw"></div><</div>
| |
| − |
| |
| − | <div style = "width:100%; height:89vh;"></div>
| |
| − |
| |
| − | </body>
| |
| − |
| |
| − | <script type="text/javascript">
| |
| − | $(document).ready(
| |
| − | function(){
| |
| − | var n = 2;
| |
| − | var t = 40;
| |
| − | setInterval(function () {t = t+1}, 1000);
| |
| − | setInterval(function () {
| |
| − | if (t>39) {
| |
| − | n = n+1;
| |
| − | if (n==3) {
| |
| − | $("#two").css('left', '110%')
| |
| − | $('#two').animate({'left':'10%'}, 500);
| |
| − | $("#one").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==4) {
| |
| − | $("#three").css('left', '110%');
| |
| − | $('#three').animate({'left':'10%'}, 500);
| |
| − | $("#two").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==5) {
| |
| − | $("#four").css('left', '110%');
| |
| − | $('#four').animate({'left':'10%'}, 500);
| |
| − | $("#three").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==6) {
| |
| − | $("#five").css('left', '110%');
| |
| − | $('#five').animate({'left':'10%'}, 500);
| |
| − | $("#four").animate({'left':'-110%'}, 500);}
| |
| − | else if (n == 7) {
| |
| − | $("#one").css('left', '110%');
| |
| − | $("#five").animate({'left':'-110%'}, 500);
| |
| − | $("#one").animate({'left':'10%'}, 500);
| |
| − | n = 2;}}
| |
| − | }, 3000);
| |
| − |
| |
| − | $("#forward").click(function () {
| |
| − | t = 0;
| |
| − | n = n+1;
| |
| − | if (n==3) {
| |
| − | $("#two").css('left', '110%')
| |
| − | $('#two').animate({'left':'10%'}, 500);
| |
| − | $("#one").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==4) {
| |
| − | $("#three").css('left', '110%');
| |
| − | $('#three').animate({'left':'10%'}, 500);
| |
| − | $("#two").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==5) {
| |
| − | $("#four").css('left', '110%');
| |
| − | $('#four').animate({'left':'10%'}, 500);
| |
| − | $("#three").animate({'left':'-110%'}, 500);}
| |
| − | else if (n==6) {
| |
| − | $("#five").css('left', '110%');
| |
| − | $('#five').animate({'left':'10%'}, 500);
| |
| − | $("#four").animate({'left':'-110%'}, 500);}
| |
| − | else if (n == 7) {
| |
| − | $("#one").css('left', '110%');
| |
| − | $("#five").animate({'left':'-110%'}, 500);
| |
| − | $("#one").animate({'left':'10%'}, 500);
| |
| − | n = 2;}
| |
| − | });
| |
| − |
| |
| − | $("#reverse").click(function () {
| |
| − | t = 0;
| |
| − | n = n-1;
| |
| − | if (n == 1) {
| |
| − | $("#five").css('left', '-110%');
| |
| − | $("#five").animate({'left':'10%'}, 500);
| |
| − | $("#one").animate({'left':'110%'}, 500);
| |
| − | n = 6;}
| |
| − | else if (n==2) {
| |
| − | $("#one").css('left', '-110%');
| |
| − | $('#one').animate({'left':'10%'}, 500);
| |
| − | $("#two").animate({'left':'110%'}, 500);}
| |
| − | else if (n==3) {
| |
| − | $("#two").css('left', '-110%');
| |
| − | $('#two').animate({'left':'10%'}, 500);
| |
| − | $("#three").animate({'left':'110%'}, 500);
| |
| − | $("#four").css('left', '-110%');}
| |
| − | else if (n==4) {
| |
| − | $("#three").css('left', '-110%');
| |
| − | $('#three').animate({'left':'10%'}, 500);
| |
| − | $("#four").animate({'left':'110%'}, 500);}
| |
| − | else if (n==5) {
| |
| − | $("#four").css('left', '-110%');
| |
| − | $('#four').animate({'left':'10%'}, 500);
| |
| − | $("#five").animate({'left':'110%'}, 500);}
| |
| − | });
| |
| − |
| |
| − | });
| |
| − | </script>
| |
| − |
| |
| − | </html>
| |
