(65 intermediate revisions by 4 users not shown) | |||
Line 1: | Line 1: | ||
− | + | ||
<html> | <html> | ||
+ | <head> | ||
+ | <meta charset="utf-8"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:USTC/css/fullpage?action=raw&ctype=text/css"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:USTC/css/materializemain?action=raw&ctype=text/css"> | ||
+ | <style> | ||
+ | .nav_bar1 ul li ul li a{display:block;width:130px;height:25px; margin:0;background: #E3FBE7;opacity: 0.4} | ||
+ | .main_text{color:#fff;text-shadow:1px 1px 2px black;} | ||
− | |||
− | |||
− | |||
+ | .section {font: 50px "Microsoft Yahei"; color: #fff;} | ||
+ | .cardbox{ | ||
+ | width: 90%; | ||
+ | height:90%; | ||
+ | font-size: 20px; | ||
+ | } | ||
+ | .cardbox img{ | ||
+ | -webkit-transition: opacity 2s, -webkit-transform 2s; | ||
+ | transition: opacity 0.5s, transform 0.5s; | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | border-radius:20px; | ||
+ | opacity: 0.6; | ||
+ | } | ||
+ | span{ | ||
+ | position: unset!important; | ||
+ | } | ||
+ | #top_menu_inside .section .google span{ | ||
+ | float: unset!important; | ||
+ | } | ||
+ | .cardbox-text{ | ||
+ | position: relative!important; | ||
+ | bottom: 2.5rem; | ||
+ | left: 9px; | ||
+ | float: left; | ||
+ | font:1.15rem Microsoft Yahei; | ||
+ | font-weight: bold; | ||
+ | color: black; | ||
+ | } | ||
+ | .cardbox img:hover{ | ||
+ | opacity: 0.8; | ||
+ | -webkit-transform: scale3d(1.1,1.1,1); | ||
+ | transform: scale3d(1.1,1.1,1); | ||
+ | } | ||
+ | .contactbox{ | ||
+ | width: 95%; | ||
+ | height: 95px; | ||
+ | margin-top: -40px; | ||
+ | padding-top: 7px; | ||
+ | } | ||
+ | .contactbox img{ | ||
+ | border-radius: 0px; | ||
+ | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | .suit_for_pic{ | |
+ | font-size: 24px!important; | ||
+ | font-weight: bold; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | margin-top:-52px; | ||
+ | margin-left:-67px; | ||
+ | width:100%; | ||
+ | text-align:unset!important; | ||
+ | } | ||
+ | .bg_pic_right{ | ||
+ | margin-top: -9%; | ||
+ | } | ||
− | + | .footerContainer{ | |
− | + | text-align: center; | |
− | + | } | |
− | + | .reminder{color: #fff; | |
− | + | font-size: 14px; | |
− | + | text-align: bottom; | |
− | + | } | |
− | + | ||
− | + | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | < | + | #top_title{ |
− | < | + | display: none!important; |
− | < | + | } |
+ | #sideMenu{ | ||
+ | display: none!important; | ||
+ | } | ||
+ | #content{ | ||
+ | width: auto!important; | ||
+ | padding: 0!important; | ||
+ | margin-top: -24px!important; | ||
+ | margin-left: 0!important; | ||
+ | } | ||
+ | </style> | ||
+ | <script type="text/javascript" src="https://2017.igem.org/Template:USTC/js/jquery?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2017.igem.org/Template:USTC/js/fullpage?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript" src="https://2017.igem.org/Template:USTC/js/materialize?action=raw&ctype=text/javascript"></script> | ||
+ | <script> | ||
+ | $(function(){ | ||
+ | $('#dowebok').fullpage({ | ||
+ | 'navigation': true, | ||
+ | |||
+ | afterLoad: function(anchorLink, index){ | ||
+ | if(index == 2){ | ||
+ | $('.section2').find('.fadeleft').addClass('inview'); | ||
+ | $('.section2').find('.faderight').addClass('inview'); | ||
+ | } | ||
+ | if(index == 3){ | ||
+ | $('.section3').find('.fadeleft').addClass('inview'); | ||
+ | $('.section3').find('.faderight').addClass('inview'); | ||
− | + | } | |
+ | if(index == 4){ | ||
+ | $('.section4').find('.fadeleft').addClass('inview'); | ||
+ | $('.section4').find('.faderight').addClass('inview'); | ||
+ | } | ||
+ | if(index == 5){ | ||
+ | $('.section5').find('.fadeleft').addClass('inview'); | ||
+ | $('.section5').find('.faderight').addClass('inview'); | ||
+ | } | ||
+ | if(index == 6){ | ||
+ | $('.section6').find('.fadedown').addClass('inview'); | ||
+ | $('.section6').find('.fadeup').addClass('inview'); | ||
+ | } | ||
+ | }, | ||
+ | onLeave: function(index, direction){ | ||
+ | if(index == '2'){ | ||
+ | $('.section2').find('.fadeleft').removeClass('inview'); | ||
+ | $('.section2').find('.faderight').removeClass('inview'); | ||
+ | } | ||
+ | if(index == '3'){ | ||
+ | $('.section3').find('.fadeleft').removeClass('inview'); | ||
+ | $('.section3').find('.faderight').removeClass('inview'); | ||
+ | } | ||
+ | if(index == '4'){ | ||
+ | $('.section4').find('.fadeleft').removeClass('inview'); | ||
+ | $('.section4').find('.faderight').removeClass('inview'); | ||
+ | } | ||
+ | if(index == '5'){ | ||
+ | $('.section5').find('.fadeleft').removeClass('inview'); | ||
+ | $('.section5').find('.faderight').removeClass('inview'); | ||
+ | |||
+ | } | ||
+ | if(index == 6){ | ||
+ | $('.section6').find('.fadedown').removeClass('inview'); | ||
+ | $('.section6').find('.fadeup').removeClass('inview'); | ||
− | + | } | |
− | + | } | |
− | + | ,resize:true | |
− | + | ||
− | + | }); | |
+ | }); | ||
+ | $(document).ready(function(){ | ||
+ | $('.slider').slider(); | ||
+ | }); | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
+ | $(document).ready(function(){ | ||
+ | $(".hover_it").hover(function(){ | ||
+ | $(this).children("ul").slideDown(150); | ||
+ | },function(){ | ||
+ | $(this).children("ul").slideUp(150); | ||
+ | }); | ||
+ | }); | ||
− | + | $(window).load(function(){ | |
− | + | document.getElementById("top_title").style.display="none"; | |
− | + | }); | |
− | + | $(window).load(function(){ | |
− | + | document.getElementById("sideMenu").style.display="none"; | |
− | + | }); | |
− | + | $(window).load(function(){ | |
− | + | document.getElementById("content").style.width="auto"; | |
− | + | }); | |
− | + | $(window).load(function(){ | |
− | </ | + | document.getElementById("content").style.padding="0"; |
− | </ | + | }); |
+ | </script> | ||
+ | </head> | ||
− | < | + | <body> |
− | + | ||
− | + | ||
− | + | ||
− | <a href="https://2017.igem.org/ | + | <div id="dowebok"> |
− | + | <div class="section section1" id="page1"> | |
− | </a> | + | <div class="nav_bar1"> |
− | </ | + | <ul> |
− | </div> | + | <li class="hover_it"> |
+ | <a href="#">Project</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Description">Project</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Model">Modeling</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Safety">Safety</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Parts">Parts</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Notebook">Notebook</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Attributions">Attributions</a></li> | ||
+ | <li class="hover_it"> | ||
+ | <a href="#">Human Practice</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/HP/Silver">Silver HP</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/HP/Gold_Integrated" style="font-size: 11px">Integrated and Gold</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Achievements">Achievements</a></li> | ||
+ | <li><a href="https://2017.igem.org/Team:USTC/Team">Team</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | |||
+ | <div class="slider fullscreen"> | ||
+ | <ul class="slides"> | ||
+ | <li> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/thumb/a/aa/Ustc_mainweb1_1.jpg/1200px-Ustc_mainweb1_1.jpg"> | ||
+ | <div class="caption center-align"> | ||
+ | <h1 class="main_text" style="padding-top: 50px ">PELICAN</h1> | ||
+ | <h4 class="light grey-text text-lighten-3 main_text">Photo-Electro-e.coLI CAN provide you a brand new experience of bio-synthesis! | ||
+ | </h4> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | <li> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/thumb/5/50/Mainweb1_2.jpg/1200px-Mainweb1_2.jpg"> | ||
+ | <div class="caption center-align" style="margin-top: -5%"> | ||
+ | <h2 class="main_text">Team USTC</h2> | ||
+ | <h4 class="light grey-text text-lighten-3 main_text">smart and hardworking</h4> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/thumb/2/2b/Ustc_mainweb1_3.jpg/1200px-Ustc_mainweb1_3.jpg"> | ||
+ | <div class="caption center-align"> | ||
+ | <h1 class="main_text">Campus</h1> | ||
+ | <h4 class="light grey-text text-lighten-3 main_text">beautiful scene</h4> | ||
+ | </div> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="section section2" id="page2"> | ||
+ | <div class="secondContainer"> | ||
+ | <div class="row"> | ||
+ | <div class="check-inview fadeleft"> | ||
+ | <div class="col s8 " style="text-align: center"><img src="https://static.igem.org/mediawiki/2017/2/29/Ustc_bacteria1.jpg " width="80%" height="80%" style="border-radius: 8px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s4"> | ||
+ | <img class="bg_pic_right" src="https://static.igem.org/mediawiki/2017/thumb/0/05/Ustc_bg_right1.png/900px-Ustc_bg_right1.png" width="80%" height="80%"> | ||
+ | <div class="text2 caption left-align check-inview faderight"> | ||
+ | <p class="suit_for_pic">Hi, I'm PELICAN, the spokesman of electrons and light. Let me show you a brand new exprerience of bio-synthesis.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="section section3" id="page3"> | ||
+ | <div class="thirdContainer"> | ||
+ | <div class="row"> | ||
+ | <div class="check-inview fadeleft"> | ||
+ | <div class="col s8 " style="text-align: center"><img src="https://static.igem.org/mediawiki/2017/thumb/d/d9/Ustc_bacteria2.jpg/1200px-Ustc_bacteria2.jpg " width="80%" height="80%" style="border-radius: 8px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s4"> | ||
+ | <img class="bg_pic_right" src="https://static.igem.org/mediawiki/2017/thumb/d/df/Ustc_bg_right2.png/900px-Ustc_bg_right2.png" width="80%" height="80%"> | ||
+ | <div class="text2 caption left-align check-inview faderight"> | ||
+ | <p class="suit_for_pic">Drinking this electron-cola, I can use the electrons in it to synthesize more products for you in a shorter time.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="section section4" id="page4"> | ||
+ | <div class="fourthContainer"> | ||
+ | <div class="row"> | ||
+ | <div class="check-inview fadeleft"> | ||
+ | <div class="col s8 " style="text-align: center"><img src="https://static.igem.org/mediawiki/2017/thumb/5/51/Ustc_bacteria3.jpg/1200px-Ustc_bacteria3.jpg" width="80%" height="80%" style="border-radius: 8px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s4"> | ||
+ | <img class="bg_pic_right" src="https://static.igem.org/mediawiki/2017/thumb/5/55/Ustc_bg_right3.png/900px-Ustc_bg_right3.png" width="80%" height="80%"> | ||
+ | <div class="text2 caption left-align check-inview faderight"> | ||
+ | <p class="suit_for_pic">Taking this sunbath, I can utilize the light energy to generate more electrons. which can increase the effieciency of biosynthesis further more.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="section section5" id="page5"> | ||
+ | <div class="fifthContainer"> | ||
+ | <div class="row"> | ||
+ | <div class="check-inview fadeleft"> | ||
+ | <div class="col s8 " style="text-align: center"><img src="https://static.igem.org/mediawiki/2017/thumb/8/82/Ustc_bacteria4.jpg/1200px-Ustc_bacteria4.jpg" width="80%" height="80%" style="border-radius: 8px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s4"> | ||
+ | <img class="bg_pic_right" src="https://static.igem.org/mediawiki/2017/thumb/9/9e/Ustc_bg_right4.png/900px-Ustc_bg_right4.png" width="80%" height="80%"> | ||
+ | <div class="text2 caption left-align check-inview faderight"> | ||
+ | <p class="suit_for_pic">In a word, just to make a friend with me, I can lead you to a new era of a more effiecient bio-synthesis.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="section section6" id="page6"> | ||
+ | <div class="sixContainer"> | ||
+ | <div class="row row1" style="margin-top: -50px"> | ||
+ | <div class="col s1"></div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadedown"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Description"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/e/e2/Ustc_project.jpg" height="100%" width="100%"> | ||
+ | <span class="cardbox-text">Project</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadedown"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Model"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/fc/Ustc_modeling1.jpg" height="100%" width="100%"> | ||
+ | <span class="cardbox-text">Modeling</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadedown"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Safety"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/0/0f/Ustc_safety1.jpg" height="100%" width="100%"> | ||
+ | <span class="cardbox-text">Safety</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadedown"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Parts"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/4/44/Ustc_parts1.jpg" height="100%" width="100%"> | ||
+ | <span class="cardbox-text">Parts</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadedown"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Notebook"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/e/e9/Ustc_notebooks1.jpg" height="100%" width="100%"> | ||
+ | <span class="cardbox-text">Notebook</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s1"></div> | ||
+ | </div> | ||
+ | |||
+ | <div class="row" style="margin-bottom: 0"> | ||
+ | <div class="col s1"></div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadeup"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Attributions"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/c/c1/Ustc_Attribution.jpg" height="60%" width="100%"> | ||
+ | <span class="cardbox-text">Attributions</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadeup"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/HP/Silver"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/a/ad/Ustc_Human_Practice.jpg" height="60%" width="100%"> | ||
+ | <span class="cardbox-text">Human Practice</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadeup"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Collaborations"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/0/0a/Ustc_collaboration1.jpg" height="60%" width="100%"> | ||
+ | <span class="cardbox-text">Collaborations</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadeup"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Achievements"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/7/70/Ustc_Achievements.jpg" height="60%" width="100%"> | ||
+ | <span class="cardbox-text">Achievements</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"> | ||
+ | <div class="cardbox"> | ||
+ | <div class="check-inview fadeup"> | ||
+ | <a href="https://2017.igem.org/Team:USTC/Team"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/c/cc/Ustc_Teams.png" height="60%" width="100%"> | ||
+ | <span class="cardbox-text">Team</span> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s1"></div> | ||
+ | |||
+ | </div> | ||
+ | <div class="footer"> | ||
+ | <div class="footerContainer"> | ||
+ | <div class="row"> | ||
+ | |||
+ | <div class="col s6"> | ||
+ | <h5>Sponsored by</h5> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/4/49/Ustc_USTCIF.jpg" width="8%" height="8%" style="margin-top: -56px;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/4/4f/Ustc_ustc_teach.png" width="42%" height="78%" style="margin-top: -56px;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/thumb/6/65/Ustc_ustc_bio.jpg/1200px-Ustc_ustc_bio.jpg.png" width="42%" height="77%" style="margin-top: -56px;"> | ||
+ | </div> | ||
+ | <div class="col s4"> | ||
+ | <h5>Contact us</h5> | ||
+ | <div class="contactbox"> | ||
+ | <a class="cardbox" href="mailto:leung@mail.ustc.enu.cn"><img src="https://static.igem.org/mediawiki/2017/3/33/Ustc_mail.png" ></a> | ||
+ | <a class="cardbox" href="http://weibo.com/u/6179287269?refer_flag=1001030102_&is_hot=1#_loginLayer_1507990419608"><img src="https://static.igem.org/mediawiki/2017/a/a3/Ustc_sina.png"></a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col s2"><p class="reminder">Got the permission to use these pictures from their owners</p></div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | </body> | ||
</html> | </html> |
Latest revision as of 13:21, 30 October 2017