(Prototype team page) |
Robertking (Talk | contribs) |
||
(14 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | {{ShanghaiTech}} | + | {{ShanghaiTech/Header}} |
+ | |||
<html> | <html> | ||
− | < | + | <body> |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | < | + | <script src="/js/jquery.imagemapster.min.js"></script> |
+ | <style type="text/css"> | ||
+ | img[usemap] { | ||
+ | border: none; | ||
+ | height: auto; | ||
+ | max-width: 100%; | ||
+ | width: auto; | ||
+ | } | ||
+ | </style> | ||
+ | <script> | ||
+ | $(function() { | ||
+ | $("#header").load("/header.html"); | ||
+ | $("#footer").load("/footer.html"); | ||
+ | }); | ||
+ | $(document).ready(function () { | ||
+ | console.log($("#navbar-home")); | ||
+ | $("#navbar-home").parent().addClass('active'); | ||
+ | }); | ||
+ | </script> | ||
− | < | + | <main class="container"> |
− | < | + | <map name="map"> |
− | < | + | <!-- <area shape="circle" coords="781, 2841, 693" state ="tbl"/> --> |
− | + | <area shape="circle" coords="7139, 3777, 800" target="_blank" href="/Team:ShanghaiTech/Integrated_HP#communications-with-experts" state="tbl" /> | |
− | </ | + | <area shape="circle" coords="3624, 5683, 575" target="_blank" href="/Team:ShanghaiTech/Integrated_HP#institution-visit" state="tbl" /> |
+ | <area shape="circle" coords="3140, 2550, 569" target="_blank" href="/Team:ShanghaiTech/Public_Engagement#education" state="tbl" /> | ||
+ | <area shape="circle" coords="5052, 3144, 1059" target="_blank" href="/Team:ShanghaiTech/Integrated_HP" state="tbl" /> | ||
+ | <area shape="circle" coords="6074, 4880, 568" target="_blank" href="/Team:ShanghaiTech/Biosafety" state="tbl" /> | ||
+ | <area shape="circle" coords="774, 2834, 682" target="_blank" href="/Team:ShanghaiTech/Public_Engagement#igem-club" state="tbl" /> | ||
+ | <!-- <area shape="circle" coords="3150, 2560, 569" target="_blank" href="#" state="tbl" /> --> | ||
+ | <area shape="circle" coords="2188, 4027, 1095" target="_blank" href="/Team:ShanghaiTech/Public_Engagement" state="tbl" /> | ||
+ | </map> | ||
+ | <div style="height: 100px"></div> | ||
+ | <img class="img-fluid" src="https://static.igem.org/mediawiki/2018/6/64/T--ShanghaiTech--Human_Practice_New.svg" style="z-index:0; margin-top: -40px;"> | ||
+ | <br> | ||
+ | <p style="font-family: 'Tw Cen MT'; font-weight: bold; font-size: 30pt">Overview</p> | ||
+ | <p style="font-family: 'Quicksand Regular'; font-size: 15pt; margin-top: -20px">Science and life. The advance of science including synthetic biology cannot digress from people's daily life. And | ||
+ | laboratory creations always aim at bettering the world. What iGEM team ShanghaiTech wants to achieve this | ||
+ | year is to bridge the distance between science and the public. Through education and institutions visit, we | ||
+ | try to find the approach to build a direct relationship between laboratory and society. Through colorful | ||
+ | design in biosafety education, we help students achieve the transition from a green hand to a qualified | ||
+ | member of biological researches. Through communication with experts, we seek more possibilities in our | ||
+ | project for both laboratory-use and social-use.</p> | ||
+ | <img class="img-fluid" src="https://static.igem.org/mediawiki/2018/3/3e/T--ShanghaiTech--HP_home.png" usemap="#map" /> | ||
− | <p> | + | <p class="text-muted text-center"><u>(If you meet any compatibility issuses, like cannot open the link by clicking, try to click the below hyperlinks.)</u></p> |
− | + | <a href = "/Team:ShanghaiTech/Integrated_HP#institution-visit">Institution Visit</a><br> | |
− | + | <a href = "/Team:ShanghaiTech/Public_Engagement#education">Education</a><br> | |
− | + | <a href = "/Team:ShanghaiTech/Integrated_HP">Gold & Integrated Human Practice</a><br> | |
− | + | <a href = "/Team:ShanghaiTech/Biosafety">Biosafety</a><br> | |
− | + | <a href = "/Team:ShanghaiTech/Public_Engagement#igem-club">iGEM Club</a><br> | |
− | + | <a href = "/Team:ShanghaiTech/Public_Engagement">Silver & Best Education and Public Engagement</a><br> | |
− | + | ||
− | + | ||
− | + | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | </main> | |
+ | <script>var resizeTime = 100; | ||
+ | var resizeDelay = 100; | ||
− | + | $('img').mapster({ | |
− | + | areas: [ | |
− | + | { | |
− | + | key: 'tbl', | |
+ | fillColor: 0xffffff, | ||
+ | staticState: false, | ||
+ | stroke: true | ||
+ | } | ||
+ | ], | ||
+ | mapKey: 'state' | ||
+ | }); | ||
+ | // Resize the map to fit within the boundaries provided | ||
− | + | function resize(maxWidth, maxHeight) { | |
− | + | var image = $('img'), | |
− | + | imgWidth = image.width(), | |
− | + | imgHeight = image.height(), | |
+ | newWidth = 0, | ||
+ | newHeight = 0; | ||
+ | if (imgWidth / maxWidth > imgHeight / maxHeight) { | ||
+ | newWidth = maxWidth; | ||
+ | } else { | ||
+ | newHeight = maxHeight; | ||
+ | } | ||
+ | image.mapster('resize', newWidth, newHeight, resizeTime); | ||
+ | } | ||
+ | function onWindowResize() { | ||
− | + | var curWidth = $(window).width(), | |
+ | curHeight = $(window).height(), | ||
+ | checking = false; | ||
+ | if (checking) { | ||
+ | return; | ||
+ | } | ||
+ | checking = true; | ||
+ | window.setTimeout(function () { | ||
+ | var newWidth = $(window).width(), | ||
+ | newHeight = $(window).height(); | ||
+ | if (newWidth === curWidth && | ||
+ | newHeight === curHeight) { | ||
+ | resize(newWidth, newHeight); | ||
+ | } | ||
+ | checking = false; | ||
+ | }, resizeDelay); | ||
+ | } | ||
+ | $(window).bind('resize', onWindowResize); | ||
+ | </script> | ||
− | < | + | <br> |
− | + | ||
− | + | </body> | |
− | + | </html> | |
− | + | ||
− | + | {{ShanghaiTech/Footer}} |
Latest revision as of 02:15, 8 December 2018
Overview
Science and life. The advance of science including synthetic biology cannot digress from people's daily life. And laboratory creations always aim at bettering the world. What iGEM team ShanghaiTech wants to achieve this year is to bridge the distance between science and the public. Through education and institutions visit, we try to find the approach to build a direct relationship between laboratory and society. Through colorful design in biosafety education, we help students achieve the transition from a green hand to a qualified member of biological researches. Through communication with experts, we seek more possibilities in our project for both laboratory-use and social-use.
(If you meet any compatibility issuses, like cannot open the link by clicking, try to click the below hyperlinks.)
Institution VisitEducation
Gold & Integrated Human Practice
Biosafety
iGEM Club
Silver & Best Education and Public Engagement