Difference between revisions of "Template:CSU CHINA"

Line 36: Line 36:
 
         .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; }
Line 69: Line 54:
 
         // 若文档高度小于窗口高度,赞助框位于页面最底部
 
         // 若文档高度小于窗口高度,赞助框位于页面最底部
 
         $(document).ready(function(){
 
         $(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(){
 
             $(window).scroll(function(){
Line 82: Line 60:
 
                 else  
 
                 else  
 
                     $("#navigator").removeClass("trans").addClass("bg-dark");
 
                     $("#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");
 
 
             });
 
             });
 
         });
 
         });
Line 152: Line 105:
 
                     <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 dropdown">
                        <a class="nav-link" href="#">LAB</a>
+
                    <a class="nav-link dropdown-toggle" href="#" id="navbar_LAB" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">LAB</a>
 +
                    <div class="dropdown-menu  bg-light" aria-labelledby="navbarDropdown">
 +
                            <a class="dropdown-item" href="/Team:CSU_CHINA/LabTask">LABTASK</a>
 +
                        <a class="dropdown-item" href="/Team:CSU_CHINA/Notebook">NOTEBOOK</a>
 +
                        <a class="dropdown-item" href="/Team:CSU_CHINA/Protocols">POROYOCOLS</a>
 +
                    </div>
 
                 </li>
 
                 </li>
 
                 <li class="nav-item dropdown">
 
                 <li class="nav-item dropdown">
Line 169: Line 127:
 
         </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:&nbsp;&nbsp;&nbsp;CSU_CHINA_iGEM@163.com&nbsp;&nbsp;&nbsp;or&nbsp;&nbsp;&nbsp;CSUigem2019@gmail.com<br>© 2018 COPYRIGHT: CSU-CHINA</p>
 
        </div>
 
    </footer>
 
  
 
</body>
 
</body>
  
 
</html>
 
</html>

Revision as of 05:49, 21 October 2019