From ffa989e5f8a167b0cb03ecc88f1ab16495a797b7 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@63.com>
Date: 星期五, 23 十二月 2022 08:17:10 +0800
Subject: [PATCH] #
---
src/main/webapp/views/news.html | 59 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 56 insertions(+), 3 deletions(-)
diff --git a/src/main/webapp/views/news.html b/src/main/webapp/views/news.html
index 15ecfc8..3af6366 100644
--- a/src/main/webapp/views/news.html
+++ b/src/main/webapp/views/news.html
@@ -3,14 +3,67 @@
<head>
<meta charset="UTF-8">
<title>NEWS</title>
+ <style>
+ /*=============== SCROLL UP ===============*/
+ .scrollup {
+ text-decoration: none;
+ text-align: center;
+ width: 25px;
+ height: 18px;
+ position: fixed;
+ right: 1rem;
+ bottom: -55%;
+ background-color: rgb(108,167,168);
+ box-shadow: 0 8px 12px hsla(228, 66%, 45%, .1);
+ display: inline-flex;
+ padding: .35rem;
+ border-radius: .25rem;
+ color: #ffffff;
+ z-index: 10;
+ transition: .3s;
+ font-size: 8px;
+ }
+ .scrollup:hover {
+ transform: translateY(-.25rem);
+ }
+ /* Show Scroll Up*/
+ .show-scroll {
+ bottom: 5%;
+ }
+
+ </style>
</head>
<body>
-<h1>Hello World</h1>
+
+<a class="scrollup" id="scroll-up">
+ <span>椤堕儴</span>
+</a>
</body>
<script src="../static/js/jquery/jquery-3.3.1.min.js"></script>
<script>
+ var autoScroll = true;
+
+ function scrollUp(){
+ const scrollUp = document.getElementById('scroll-up');
+ if(this.scrollY >= 100) scrollUp.classList.add('show-scroll'); else scrollUp.classList.remove('show-scroll')
+ }
+ window.addEventListener('scroll', scrollUp)
+
+ $(document).on('click ','#scroll-up', function () {
+ window.scrollTo(0, 0);
+ autoScroll = false;
+ })
+
+ $(document).on('click ','body', function () {
+ autoScroll = false;
+ })
+
setInterval(()=>{
- $("body").append("<h1>Hello World</h1>");
- }, 2000)
+ $("body").append(new Date() + "<h4>Hello World</h4>");
+ if (autoScroll) {
+ window.scrollTo(0, document.body.scrollHeight)
+ }
+ }, 500)
+
</script>
</html>
--
Gitblit v1.9.1