Line 150: | Line 150: | ||
</div> | </div> | ||
− | |||
<div class="ui segment" id="ui_article" style="margin-left: 35px; margin-right:35px; margin-top:30px;"> | <div class="ui segment" id="ui_article" style="margin-left: 35px; margin-right:35px; margin-top:30px;"> | ||
− | <div class="ui orange ribbon label header"> | + | <div class="ui orange ribbon label header">Our instructors</div> |
− | + | <div class="ui three column grid"> | |
− | + | <div class="ui column"> | |
− | + | <div class="card"> | |
− | + | <div class="content"> | |
− | + | <img class="right floated tiny ui image" src="http://www.semantic-ui.cn/images/avatar/large/elliot.jpg"> | |
− | + | <div class="header">Elliot Fu </div> | |
− | + | <div class="meta">Friends of Veronika </div> | |
− | + | <div class="description">Elliot requested permission to view your contact details </div> | |
− | + | </div> | |
− | <div class="ui | + | |
− | + | ||
− | <div class=" | + | |
− | < | + | |
− | < | + | |
− | + | ||
− | + | ||
− | + | ||
− | < | + | |
− | <div class=" | + | |
− | + | ||
− | + | ||
− | + | ||
− | <div class=" | + | |
− | </ | + | |
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
</div> | </div> | ||
− | <div class="ui | + | </div><!--End of ui basic segment id="main_page_content"--> |
− | + | ||
− | + | <div style="background-color:#44a17d; color:rgba(255, 255, 255, 0.9);"> | |
− | + | <div class="ui grid"> | |
− | + | ||
+ | <div class="ui three wide column"> | ||
+ | </div> | ||
+ | <div class="ui five wide column"> | ||
+ | <h3 class="ui header" style="color:rgba(255, 255, 255, 0.9);">Contact us</h3> | ||
+ | <div class="ui massive link list" style="color:rgba(255, 255, 255, 0.9);"> | ||
+ | <a class="item" href="mailto:yukae@mail.ustc.edu.cn"> | ||
+ | <i class="mail icon" style="color:rgba(255, 255, 255, 0.9);"></i> | ||
+ | <div class="content" style="color:rgba(255, 255, 255, 0.9);">e-mail</div> | ||
+ | </a> | ||
+ | <a class="item" href="https://www.facebook.com/ustcigem"> | ||
+ | <i class="facebook icon" style="color:rgba(255, 255, 255, 0.9);"></i> | ||
+ | <div class="content" style="color:rgba(255, 255, 255, 0.9);">Facebook</div> | ||
+ | </a> | ||
+ | <a class="item" href="http://weibo.com/3929719655/fans?topnav=1&wvr=6&mod=message&need_filter=1"> | ||
+ | <i class="weibo icon" style="color:rgba(255, 255, 255, 0.9);"></i> | ||
+ | <div class="content" style="color:rgba(255, 255, 255, 0.9);">Weibo</div> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="ui two wide column"> | ||
+ | </div> | ||
+ | <div class="ui five wide column"> | ||
+ | <h3 class="ui header" style="color:rgba(255, 255, 255, 0.9);">Sponsors</h3> | ||
+ | <img class="ui small image" src="https://static.igem.org/mediawiki/2016/c/cc/T--USTC--DeutscheBank.png"> | ||
+ | <img class="ui small image" src="https://static.igem.org/mediawiki/2016/1/18/T--USTC--USTCXiaohui.png"> | ||
+ | <img class="ui small image" src="https://static.igem.org/mediawiki/2016/4/45/T--USTC--USTCJiaowuchu.png"> | ||
+ | </div> | ||
+ | |||
</div> | </div> | ||
+ | <div class="ui divider"></div> | ||
+ | <div class="center aligned container"> | ||
+ | <img class="ui centered tiny image" src="https://static.igem.org/mediawiki/2016/6/6b/T--USTC--MascotLogo.png"> | ||
+ | <div class="ui list"> | ||
+ | <div class="item">Designed by 2016 iGEM Team:USTC<br>Under CC License<br>Based on Semantic-UI</div> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
</div> | </div> | ||
+ | </div><!--end of pusher--> | ||
+ | <script type="text/javascript" src="https://2016.igem.org/Template:USTC/semanticsjs?action=raw&ctype=text/javascript"></script> | ||
+ | <script type="text/javascript"> | ||
+ | </script> | ||
+ | <script> | ||
+ | $(document).ready(function(){ | ||
+ | $('.ui.sticky.basic.menu').sticky({ | ||
+ | context: '#main_page_content' | ||
+ | }); | ||
+ | $("a.item#Description").mouseenter(function(){ | ||
+ | $(".sticky.note.outline.icon").transition({ | ||
+ | animation : 'fly right', | ||
+ | duration : '0.5s' | ||
+ | }); | ||
+ | }); | ||
+ | $("a.item#Description").mouseleave(function(){ | ||
+ | $(".sticky.note.outline.icon").transition({ | ||
+ | animation : 'fly right', | ||
+ | duration : '0.5s' | ||
+ | }); | ||
+ | //$(this).css({"background-color":"inherit","color":"inherit"}); | ||
+ | }); | ||
+ | $container.find('img').css('max-width','100%'); | ||
+ | createMenu(); | ||
+ | });//End of $(document).ready(function()) | ||
− | + | $(window).load(function(){ | |
− | + | createWayPoints(); | |
− | + | $("div.pusher").prependTo("body"); | |
− | + | $("div.sidebar").prependTo("body"); | |
− | + | $("div#sideMenu").prependTo("div.pusher"); | |
− | + | $("#ui_article").find("span").css("border-style","none"); | |
− | + | }); | |
− | + | $("#sidebarMenuTrigger").click(function(){ | |
− | + | $(".ui.sidebar.menu") | |
− | + | .sidebar('setting', 'transition', 'overlay') | |
− | + | .sidebar('setting', 'mobileTransition', 'overlay') | |
− | + | .sidebar('toggle'); | |
− | + | }); | |
− | + | </script> | |
− | + | </body> | |
− | + | </html> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + |
Revision as of 18:23, 16 October 2016