diff --git a/wiki/footer.html b/wiki/footer.html index bbd62ed4998e839c60b4d9ce4392ec62e55ac132..e9e9523b0c5d74a49e7373d520c54455b19ddaf3 100644 --- a/wiki/footer.html +++ b/wiki/footer.html @@ -1,3 +1,9 @@ +<div class="goTop"> + + <span>back To top</span> + +</div> + <footer> @@ -74,15 +80,66 @@ </footer> -<div style="font-size: 1.5rem; color: rgb(0, 0, 0);width: 100vw;padding: 30px 20vw;background-color: #fff;"> +<div style="font-size: 1.5rem; color: rgb(0, 0, 0);width: 100vw;padding: 30px 20vw;background-color: #fff;margin: 0 auto;"> <div> <p><small>© 2022 - Content on this site is licensed under a <a style="color: #108b96;" href="https://creativecommons.org/licenses/by/4.0/" rel="license">Creative Commons Attribution 4.0 International license</a>.</small></p> <p><small>The repository used to create this website is available at <a style="color: #108b96;" href="https://gitlab.igem.org/2022/sesame-shenzhen">gitlab.igem.org/2022/sesame-shenzhen</a>.</small></p> </div> </div> - <script> + function goTop(min_height) { + + $(".goTop").click( + + function() { + + $('html,body').animate({ + + scrollTop: 0 + + }, 700); + + }); + + //获å–页é¢çš„æœ€å°é«˜åº¦ï¼Œæ— ä¼ å…¥å€¼åˆ™é»˜è®¤ä¸º600åƒç´ + + min_height=min_height?min_height:400; + + //为窗å£çš„scroll事件绑定处ç†å‡½æ•° + + $(window).scroll(function() { + + //获å–窗å£çš„æ»šåЍæ¡çš„垂直ä½ç½® + + var s = $(window).scrollTop(); + + //当窗å£çš„æ»šåЍæ¡çš„垂直ä½ç½®å¤§äºŽé¡µé¢çš„æœ€å°é«˜åº¦æ—¶ï¼Œè®©è¿”å›žé¡¶éƒ¨å…ƒç´ æ¸çŽ°ï¼Œå¦åˆ™æ¸éš + + if (s > min_height) { + + $(".goTop").fadeIn(100); + + } else { + + $(".goTop").fadeOut(200); + + } + + }); + + } + + + + + + $(function() { + + goTop(); + + }); + $("a[href*=\\#],area[href*=\\#]").click(function() { //若报错则改为$(document).on('click', 'a[href^="#"]', function () { console.log(111) diff --git a/wiki/menu.html b/wiki/menu.html index 2bf21ffc98a1cfdef8725edf89cb4767f3cf4044..c00caa5d980d152f8eefe1ef6f2e69d113f3c0f5 100644 --- a/wiki/menu.html +++ b/wiki/menu.html @@ -14,6 +14,42 @@ margin-top: 27vh; margin-left: 35vw; } + .goTop { + + height: 44px; + + width: 128px; + + background: #509296; + + border-radius: 22px; + + position: fixed; + + top: 90%; + + right: 3%; + + display: none; + + } + + + + .goTop span { + + color: #fff; + + position: absolute; + + top: 12px; + + left: 8px; + width:88%; + margin: 0 auto; + text-align:center; + + } </style>