The scroll button has been updated

The up button does not appear when the page loads
The down button moves to the end of the page or to the position where the Up button was pressed

template/all.html

@@ -102,7 +102,7 @@
     <script type="text/javascript" src="[js]bootbox.js"></script>
     <script type="text/javascript" src="[js]code.js"></script>
     <script type="text/javascript" src="[js]functions.js"></script>
-    <script type="text/javascript" src="[js]top.js"></script>
+    <script type="text/javascript" src="[js]scrollup.js"></script>
     <script type="text/javascript" src="[js]google-translate.js"></script>
     <script src="//translate.google.com/translate_a/element.js?cb=TranslateInit"></script>
     <script type="text/javascript" src="[js]jquery.cookie.min.js"></script>
@@ -166,9 +166,6 @@
             |_auth|
         </div>
     </div>
-    <p id="back-top">
-        <a href="#top"><span></span>Вверх</a>
-    </p>
     <div class="nav">
         [nav]
     </div>
@@ -245,5 +242,8 @@
             <span class="l-6"></span>
         </div>
     </div>
+
+    <div class="scroll-button" id="scroll-up">&#9650;</div>
+    <div class="scroll-button" id="scroll-down">&#9660;</div>
 </body>
 </html>

template/css/style.css

@@ -1510,48 +1510,34 @@ blockquote {
     word-wrap: break-word
 }
 
-/*Стилизация кнопки ВВЕРХ */
-#back-top {
+.scroll-button {
+    width: 50px; /* Ширина кнопки */
+    height: 50px; /* Высота кнопки */
     position: fixed;
-    bottom: 30px;
-    left: 50%;
-    margin-left: 200px
-}
-
-#back-top a {
-    width: 64px;
-    display: block;
+    bottom: 20px; /* Отступ от нижнего края */
+    background-color: rgba(252, 252, 252, 0.8); /* Полупрозрачный фон */
+    color: #aaa;
+    font-size: 25px; /* Размер значка */
     text-align: center;
-    font: 11px/100% Arial, Helvetica, sans-serif;
-    text-transform: uppercase;
-    text-decoration: none;
-    color: #bbb;
-    /* background color transition */
-    -webkit-transition: 1s;
-    -moz-transition: 1s;
-    transition: 1s;
+    line-height: 50px; /* Центрируем текст по вертикали */
+    border-radius: 10px; /* Закругленные углы */
+    cursor: pointer;
+    transition: background .2s ease, opacity .2s ease;
+    opacity: 0.5; /* Полупрозрачная кнопка */
 }
 
-#back-top a:hover {
-    color: #000;
+.scroll-button:hover {
+    background-color: rgba(238, 238, 238, 0.8); /* Прозрачность при наведении */
+    color: #777777;
+    opacity: 1; /* Полная непрозрачность при наведении */
 }
 
-/* графическая стрелка ВВЕРХ */
-#back-top span {
-    width: 64px;
-    height: 50px;
-    display: block;
-    background: url(../images/up-arrow.png) no-repeat center center;
-    -webkit-border-radius: 15px;
-    -moz-border-radius: 15px;
-    border-radius: 15px;
-    -webkit-transition: 1s;
-    -moz-transition: 1s;
-    transition: 1s;
+#scroll-up {
+    right: 80px; /* Отступ от правого края для кнопки "Наверх" */
 }
 
-#back-top a:hover span {
-    background-color: #eeeeee26
+#scroll-down {
+    right: 20px; /* Отступ от правого края для кнопки "Вниз" */
 }
 
 .partnerList {

template/js/scrollup.js

@@ -0,0 +1,56 @@
+/*
+ * EngineGP   (https://enginegp.ru or https://enginegp.com)
+ *
+ * @copyright Copyright (c) 2018-present Solovev Sergei <inbox@seansolovev.ru>
+ *
+ * @link      https://github.com/EngineGPDev/EngineGP for the canonical source repository
+ * @link      https://gitforge.ru/EngineGP/EngineGP for the canonical source repository
+ *
+ * @license   https://github.com/EngineGPDev/EngineGP/blob/main/LICENSE MIT License
+ * @license   https://gitforge.ru/EngineGP/EngineGP/src/branch/main/LICENSE MIT License
+ */
+
+var lastScrollPosition = 0;
+var scrollUpClicked = false;
+
+$(document).ready(function() {
+    $('#scroll-up').click(function() {
+        lastScrollPosition = $(document).scrollTop();
+        $('html, body').animate({ scrollTop: 0 }, 1000);
+        scrollUpClicked = true;
+    });
+
+    $('#scroll-down').click(function() {
+        if (scrollUpClicked) {
+            $('html, body').animate({ scrollTop: lastScrollPosition }, 1000);
+        } else {
+            $('html, body').animate({ scrollTop: $(document).height() }, 1000);
+        }
+    });
+
+    $(document).scroll(function() {
+        var scrollTop = $(document).scrollTop();
+
+        if (scrollTop > 0) {
+            $('#scroll-up').fadeIn();
+        } else {
+            $('#scroll-up').fadeOut();
+        }
+
+        if (scrollTop < $(document).height() - $(window).height()) {
+            $('#scroll-down').fadeIn();
+        } else {
+            $('#scroll-down').fadeOut();
+        }
+    });
+
+    // Убедитесь, что кнопка "Наверх" скрыта при загрузке страницы
+    $('#scroll-up').hide();
+
+    // Проверяем начальное положение страницы при загрузке для кнопки "Вниз"
+    if ($(document).scrollTop() < $(document).height() - $(window).height()) {
+        $('#scroll-down').show();
+    } else {
+        $('#scroll-down').hide();
+    }
+});

template/js/top.js

@@ -1,35 +0,0 @@
-/*
- * EngineGP   (https://enginegp.ru or https://enginegp.com)
- *
- * @copyright Copyright (c) 2018-present Solovev Sergei <inbox@seansolovev.ru>
- *
- * @link      https://github.com/EngineGPDev/EngineGP for the canonical source repository
- * @link      https://gitforge.ru/EngineGP/EngineGP for the canonical source repository
- *
- * @license   https://github.com/EngineGPDev/EngineGP/blob/main/LICENSE MIT License
- * @license   https://gitforge.ru/EngineGP/EngineGP/src/branch/main/LICENSE MIT License
- */
-
-$(document).ready(function () {
-    // появление/затухание кнопки #back-top
-    $(function () {
-        // прячем кнопку #back-top
-        $("#back-top").hide();
-
-        $(window).scroll(function () {
-            if ($(this).scrollTop() > 100) {
-                $("#back-top").fadeIn();
-            } else {
-                $("#back-top").fadeOut();
-            }
-        });
-
-        // при клике на ссылку плавно поднимаемся вверх
-        $("#back-top a").click(function () {
-            $("body,html").animate({
-                scrollTop: 0
-            }, 800);
-            return false;
-        });
-    });
-});