Line 35: | Line 35: | ||
} | } | ||
.dropdown-menu{ | .dropdown-menu{ | ||
− | margin-top: -2px | + | margin-top: -2px; |
+ | } | ||
+ | body{ | ||
+ | min-height: 100%; | ||
+ | } | ||
+ | footer{ | ||
+ | width: 100%; | ||
+ | background-color: rgb(52,58,64); | ||
+ | bottom: 0px; | ||
+ | } | ||
+ | .socialmedia{ | ||
+ | height: 50px; width: 50px; margin:20px; | ||
+ | } | ||
+ | #lab{ | ||
+ | -webkit-filter: grayscale(100%); | ||
+ | filter: grayscale(100%); | ||
} | } | ||
− | |||
#top_title{ display:none; } | #top_title{ display:none; } | ||
#content{ | #content{ | ||
Line 49: | Line 63: | ||
padding: 8px 8px 8px 8px; | padding: 8px 8px 8px 8px; | ||
} | } | ||
+ | |||
</style> | </style> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | // 若文档高度小于窗口高度,赞助框位于页面最底部 | ||
+ | $(document).ready(function(){ | ||
+ | if(screen.height>=$(document).height()){ | ||
+ | $("footer").css("position","fixed"); | ||
+ | } | ||
+ | $(".dropdown").hover(function() { | ||
+ | stop(true,true); | ||
+ | $('.dropdown-menu', this).slideToggle("fast"); | ||
+ | }); | ||
+ | // 滚动渐隐 | ||
+ | $(window).scroll(function(){ | ||
+ | if ($(document).scrollTop() > 50) | ||
+ | $("#navigator").removeClass("bg-dark").addClass("trans"); | ||
+ | else | ||
+ | $("#navigator").removeClass("trans").addClass("bg-dark"); | ||
+ | }); | ||
+ | // 图标变色 | ||
+ | $("#facebook").mouseenter(function(){ | ||
+ | $(this).attr("src","../iGEM/img/facebook.png"); | ||
+ | }); | ||
+ | $("#facebook").mouseleave(function(){ | ||
+ | $(this).attr("src","../iGEM/img/greyfacebook.png"); | ||
+ | }); | ||
+ | $("#twitter").mouseenter(function(){ | ||
+ | $(this).attr("src","../iGEM/img/twitter.png"); | ||
+ | }); | ||
+ | $("#twitter").mouseleave(function(){ | ||
+ | $(this).attr("src","../iGEM/img/greytwitter.png"); | ||
+ | }); | ||
+ | $("#weibo").mouseenter(function(){ | ||
+ | $(this).attr("src","../iGEM/img/weibo.png"); | ||
+ | }); | ||
+ | $("#weibo").mouseleave(function(){ | ||
+ | $(this).attr("src","../iGEM/img/greyweibo.png"); | ||
+ | }); | ||
+ | $("#wechat").mouseenter(function(){ | ||
+ | $(this).attr("src","../iGEM/img/wechat.png"); | ||
+ | }); | ||
+ | $("#wechat").mouseleave(function(){ | ||
+ | $(this).attr("src","../iGEM/img/greywechat.png"); | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
<nav class="navbar navbar-expand-lg navbar-dark py-0 fixed-top bg-dark" id="navigator" > | <nav class="navbar navbar-expand-lg navbar-dark py-0 fixed-top bg-dark" id="navigator" > | ||
Line 64: | Line 124: | ||
</li> | </li> | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PROJECT</a> | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PROJECT</a> |
<div class="dropdown-menu bg-light " aria-labelledby="navbarDropdown"> | <div class="dropdown-menu bg-light " aria-labelledby="navbarDropdown"> | ||
<a class="dropdown-item" href="">DESCRIPTION</a> | <a class="dropdown-item" href="">DESCRIPTION</a> | ||
Line 72: | Line 132: | ||
</li> | </li> | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PARTS</a> | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PARTS</a> |
<div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | <div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | ||
<a class="dropdown-item" href="#">BASIC PARTS</a> | <a class="dropdown-item" href="#">BASIC PARTS</a> | ||
Line 83: | Line 143: | ||
</li> | </li> | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">HUMAN PRACTICES</a> | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">HUMAN PRACTICES</a> |
<div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | <div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | ||
<a class="dropdown-item" href="/Team:CSU_CHINA/Human_Practices">INTERGRATED</a> | <a class="dropdown-item" href="/Team:CSU_CHINA/Human_Practices">INTERGRATED</a> | ||
Line 92: | Line 152: | ||
<a class="nav-link" href="/Team:CSU_CHINA/Safety">SAFETY</a> | <a class="nav-link" href="/Team:CSU_CHINA/Safety">SAFETY</a> | ||
</li> | </li> | ||
− | <li class="nav-item | + | <li class="nav-item"> |
− | + | <a class="nav-link" href="#">LAB</a> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</li> | </li> | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">TEAM</a> | + | <a class="nav-link dropdown-toggle" href="" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">TEAM</a> |
<div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | <div class="dropdown-menu bg-light" aria-labelledby="navbarDropdown"> | ||
<a class="dropdown-item" href="/Team:CSU_CHINA/Collaborations" title="">COLLABORATIONS</a> | <a class="dropdown-item" href="/Team:CSU_CHINA/Collaborations" title="">COLLABORATIONS</a> | ||
Line 114: | Line 169: | ||
</div> | </div> | ||
</nav> | </nav> | ||
− | < | + | |
− | + | ||
− | + | <footer> | |
− | + | <div class="d-flex justify-content-center align-items-center float-left" style="height: 250px; width: 40%"> | |
− | + | <div> | |
− | + | <div class="row"> | |
− | + | <a href="https://www.facebook.com/chinacsu/" target="_black"><img src="../iGEM/img/greyfacebook.png" class="socialmedia" id="facebook"></a> | |
− | + | <a href="https://twitter.com/CsuIgem?lang=en" target="_black"><img src="../iGEM/img/greytwitter.png" class="socialmedia" id="twitter"></a> | |
− | + | </div> | |
− | + | <div class="row"> | |
− | + | <a href="https://weibo.com/u/6611358555" target="_black"><img src="../iGEM/img/greyweibo.png" class="socialmedia" id="weibo"></a> | |
− | </ | + | <a href="https://mp.weixin.qq.com/s?__biz=Mzg3MDEyNjc2NA==&mid=2247483686&idx=1&sn=32f656e6776e8c24f722bd7eefc63e98&chksm=ce93c4e5f9e44df39a0bf74c5174b14d121dbf5d29046df9e3821abb372cd91b795c72c094c5&mpshare=1&scene=23&srcid=&sharer_sharetime=1571401435492&sharer_shareid=239fbe2d71f52524d0bd016637b912af#rd" target="_black"><img src="../iGEM/img/greywechat.png" class="socialmedia" id="wechat"></a> |
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="float-right d-flex justify-content-center align-items-center" style="height: 250px; width: 60%;"> | ||
+ | <img src="../iGEM/img/csu.png" style="height: 140px; margin-right: 20px"> | ||
+ | <img src="../iGEM/img/lab.png" style="height: 100px; margin-right: 20px" id="lab"> | ||
+ | </div> | ||
+ | <div class="d-flex justify-content-center" style="height: 50px; width: 100%"> | ||
+ | <p style="color: grey;" class="text-center">CONTACT US: CSU_CHINA_iGEM@163.com or CSUigem2019@gmail.com<br>© 2018 COPYRIGHT: CSU-CHINA</p> | ||
+ | </div> | ||
+ | </footer> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 05:47, 21 October 2019