Показать сообщение отдельно
  #1 (permalink)  
Старый 23.08.2024, 10:08
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 673

Сохранение информации при переходе на другую старинцу
У меня есть вот такой скрипт

document.addEventListener('DOMContentLoaded', function () {
      // Находим все ссылки с классом anchor_link
      var links = document.querySelectorAll('.anchor_link');

      // Добавляем обработчик событий на каждую ссылку
      links.forEach(function (link) {
        link.addEventListener('click', function (event) {
          // Получаем href ссылки
          var href = this.getAttribute('href');

          // Проверяем, является ли ссылка абсолютной или относительной (переход на другую страницу)
          if (href.startsWith('#')) {
            // Отменяем стандартное поведение ссылки
            event.preventDefault();

            // Получаем ID якоря из атрибута href ссылки
            var targetId = href;
            var targetElement = document.querySelector(targetId);

            // Проверяем, существует ли элемент с данным ID
            if (targetElement) {
              // Расчитываем позицию элемента относительно верхней части документа
              var targetPosition = targetElement.getBoundingClientRect().top + window.scrollY;

              // Вычисляем новую позицию с отступом 60 пикселей
              var offsetPosition = targetPosition - 60;

              // Вызов функции для плавной прокрутки
              smoothScrollTo(offsetPosition);
            }
          } else {
            // Если это не якорная ссылка, просто переходим по адресу
            window.location.href = href;
          }
        });
      });

      function smoothScrollTo(targetPosition) {
        const startPosition = window.scrollY;
        const distance = targetPosition - startPosition;
        const duration = 500; // Длительность анимации в миллисекундах
        let startTime = null;

        function animation(currentTime) {
          if (!startTime) startTime = currentTime;
          const timeElapsed = currentTime - startTime;
          const progress = Math.min(timeElapsed / duration, 1); // Нормализуем значение от 0 до 1

          // Используем функцию easing (к примеру, easeInOutQuad)
          const easing = easeInOutQuad(progress);

          window.scrollTo(0, startPosition + distance * easing);

          if (timeElapsed < duration) {
            requestAnimationFrame(animation);
          }
        }

        // Начинаем анимацию
        requestAnimationFrame(animation);
      }

      function easeInOutQuad(t) {
        return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
      }
    });


<p><a href="sample.html#a" class="anchor_link">ссылка1</a></p>
    <p><a href="sample.html#d" class="anchor_link">ссылка2</a></p>
    <p><a href="#c3" class="anchor_link">ссылка3</a></p>
    <p><a href="#d4" class="anchor_link">ссылкаd</a></p>
    <p><a href="#e5" class="anchor_link">ссылкаe</a></p>


И мне нужно что бы при переходе на другую страницу отступ от верхней границы браузера сохранялся в 60 пиксилей.

Я пробывал записывать в локам стендж и потом затирать его но не получилось по другому не понимаю как.
Ответить с цитированием