Difference between revisions of "Team:Hong Kong HKUST/Modelling Prediction Model"
Danson Loi (Talk | contribs) |
Danson Loi (Talk | contribs) |
||
| Line 13: | Line 13: | ||
<li id="circuit" style="display:block;"></li> | <li id="circuit" style="display:block;"></li> | ||
</ul> | </ul> | ||
| − | <div id="circuit-overlay"><img id="circuitFig" src="https://static.igem.org/mediawiki/2016/ | + | <div id="circuit-overlay"><img id="circuitFig" src="https://static.igem.org/mediawiki/2016/9/91/T--Hong_Kong_HKUST--construct_mode.png"></div> |
| + | |||
<div id="tour-overlay"> | <div id="tour-overlay"> | ||
| − | + | <div class="tourdiv" id="tour_none" style="z-index: 1;"> | |
| − | + | ||
| − | + | <h1> Navigation</h1> | |
| − | + | <p>Before boarding, go check out below some tricks that will be useful in the course of your journey!</p> | |
| − | + | <hr> | |
| − | + | <img src="https://static.igem.org/mediawiki/2016/b/b4/T--Hong_Kong_HKUST--Copyoftrafficlight.svg" alt="trafficlight" style="float: right;"> | |
| − | + | <h2>Trick 1 - The Mode Switcher</h2> | |
| − | + | <p1>The mode switcher, in analogue to a traffic light, combines 3 different interfaces into one powerful device switchable to one another. <br><br> Red: <b>Default mode</b> <small>(Veteran, no support needed!)</small><br> Yellow: <b>Tour mode</b> <small>(Summary of each and every page in one single map)</small> <br> Green: <b>Construct mode</b> <small>(A reference diagram of our genetic construction)</small></p1> | |
| − | + | <br> | |
| − | + | <button type="button" onclick="tour_page()">Proceed</button> | |
| − | + | ||
| − | + | </div> | |
| − | + | ||
| − | + | <div class="tourdiv" style="z-index: 2;" id="tour_next"> | |
| − | + | <img src="https://static.igem.org/mediawiki/2016/2/28/T--Hong_Kong_HKUST--route_map.svg" alt="TourMode" usemap="#RouteMap" style="margin-left: 10%; width:75%; height: 75%;"> | |
| − | </div> | + | <map name="RouteMap"> |
| − | <div class="content_wrapper" > | + | <area shape="circle" coords="242 126 20" alt="Home" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Danson" onmouseover="tourFunction_home()" onmouseout="tourFunction_home()"> |
| + | <area shape="circle" coords="333 126 20" alt="About" href="https://2016.igem.org/Team:Hong_Kong_HKUST/The_Team" onmouseover="tourFunction_about()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="429 126 20" alt="Project" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Project_Overview" onmouseover="tourFunction_project()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="530 126 20" alt="Achievements" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Parts_Submitted" onmouseover="tourFunction_achievements()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="623 126 20" alt="Future_Plan" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Future_Plan" onmouseover="tourFunction_future_plan()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="427 43 20" alt="Human Practices" href="https://2016.igem.org/Team:Hong_Kong_HKUST/HP_Intro" onmouseover="tourFunction_human_practices()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="335 220 20" alt="Modelling" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Modelling" onmouseover="tourFunction_modelling()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="335 295 20" alt="Lab" href="hhttps://2016.igem.org/Team:Hong_Kong_HKUST/Protocols_Logbook" onmouseover="tourFunction_lab()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="242 295 20" alt="Interlab" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Interlab" onmouseover="tourFunction_interlab()" onmouseout="tourFunction_home()"> | ||
| + | <area shape="circle" coords="531 223 20" alt="Collaboration" href="https://2016.igem.org/Team:Hong_Kong_HKUST/Collab" onmouseover="tourFunction_collaboration()" onmouseout="tourFunction_home()"> | ||
| + | |||
| + | </map> | ||
| + | <p id="tourPar">Welcome to HKUST 2016 iGEM team - Troika!! We made a simple tour to make navigating our website a breeze! Follow us!</p> | ||
| + | </div> | ||
| + | </div><div class="content_wrapper" > | ||
<h1><b>Modelling - Prediction Model</b></h1> | <h1><b>Modelling - Prediction Model</b></h1> | ||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.<br><br><br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.</p> | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.<br><br><br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.</p> | ||
| Line 39: | Line 54: | ||
<script> | <script> | ||
| + | function tour_page() { | ||
| + | document.getElementById("tour_none").style.display ="none"; | ||
| + | document.getElementById("tour_next").style.display = "block"; | ||
| + | |||
| + | } | ||
//Tour mode Effect of changing content | //Tour mode Effect of changing content | ||
| − | function tourFunction_home(){ | + | function tourFunction_home() { |
| − | + | document.getElementById("tourPar").innerHTML = "Welcome to HKUST 2016 iGEM team - Troika!!"; | |
| + | |||
} | } | ||
function tourFunction_about(){ | function tourFunction_about(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "Let's meet our members and see how division of labour works out in our team! Also, check out the attributed parties of our project if you may."; | |
} | } | ||
function tourFunction_project(){ | function tourFunction_project(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "Get to know our project here! We built a biological device termed as tri-stable switch that could perform three discrete but alternating, steady states driven by three different repressible promoters. What's more, you can find a schematic diagram of the genetic switch by clicking on the green light button on the top right corner for your reference!"; | |
} | } | ||
function tourFunction_achievements(){ | function tourFunction_achievements(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "We list out here the medal requirements that we have fulfilled, with other additional achievements such as new parts that we submitted to the Registry."; | |
| + | } | ||
| + | function tourFunction_future_plan(){ | ||
| + | document.getElementById("tourPar").innerHTML = "You can have a grasp of how we are to sustain our project in the future as well as how an add-on investigation on the transcriptional manipulation in collaboration with the Rice University was conducted."; | ||
} | } | ||
function tourFunction_human_practices(){ | function tourFunction_human_practices(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "For the outreach part, our main focus is on designing an applicable product of the tri-stable switch that is intended for public convenient use. Other missions that we have accomplished so far include educating high school students, exploring intellectual property right policies, and assisting other iGEM teams in plan-making."; | |
} | } | ||
function tourFunction_modelling(){ | function tourFunction_modelling(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "To evaluate our works, we identified the parameters potentially affecting our design, predict, and verify the consistency of our experimental results by bringing about a mathematical prediction model and a stability analysis."; | |
} | } | ||
function tourFunction_lab(){ | function tourFunction_lab(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "We have compiled our logbooks together with the protocols we employed in this page. Safety information is also provided."; | |
} | } | ||
function tourFunction_interlab(){ | function tourFunction_interlab(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "We joined this year's iGEM Interlab Measurement Study where we conducted a relative expression compression by green fluorescence measurement."; | |
} | } | ||
function tourFunction_collaboration(){ | function tourFunction_collaboration(){ | ||
| − | + | document.getElementById("tourPar").innerHTML = "This year, we collaborate with two institutions, NUS and IIT in respective areas."; | |
} | } | ||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
Revision as of 16:05, 15 September 2016
Navigation
Before boarding, go check out below some tricks that will be useful in the course of your journey!
Trick 1 - The Mode Switcher
Red: Default mode (Veteran, no support needed!)
Yellow: Tour mode (Summary of each and every page in one single map)
Green: Construct mode (A reference diagram of our genetic construction)
Welcome to HKUST 2016 iGEM team - Troika!! We made a simple tour to make navigating our website a breeze! Follow us!
Modelling - Prediction Model
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec magna quis lacus malesuada pellentesque sit amet et quam. Nam lectus nunc, congue sed bibendum vitae, tincidunt vitae odio. Nullam porta posuere risus consequat hendrerit. Proin ante arcu, elementum in ullamcorper sed, tempor eget purus. Nullam convallis dui vitae quam condimentum, quis rutrum diam blandit. Nam consectetur, leo eu sollicitudin venenatis, ex metus luctus arcu, et commodo mauris elit ut mi. Donec luctus diam eu tortor fringilla pharetra.
