Как можно вернуться к исходному положению при нажатии на кнопку "скрыть"?

Как переработать скрипт, чтобы при нажатии на кнопку "скрыть" область просмотра на экране оставалась на том же месте и не прокручивалась вниз?
  • 18 октября 2023 г. 13:48
Ответы на вопрос 2
1. Для вернуться к исходному положению при нажатии на кнопку "скрыть", можно использовать функцию scrollIntoView():

```javascript
document.getElementById("hide-button").addEventListener("click", function() {
  // Скрыть содержимое
  
  // Вернуться к исходному положению
  document.getElementById("header").scrollIntoView();
});
```

В данном примере при нажатии на кнопку с id "hide-button" сначала скрывается содержимое, а затем страница прокручивается к элементу с id "header" (нужно заменить на соответствующий элемент на вашей странице), который является верхней частью страницы. Это даст вам впечатление, что страница вернулась к исходному положению.

2. Чтобы оставить область просмотра на экране на том же месте без прокрутки, можно использовать свойство scrollTop элемента html или body:

```javascript
document.getElementById("hide-button").addEventListener("click", function() {
  // Скрыть содержимое
  
  // Сохранить текущую позицию прокрутки
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
  
  // Вернуться к исходному положению
  document.getElementById("header").scrollIntoView();
  
  // Восстановить позицию прокрутки
  window.scrollTo(0, scrollTop);
});
```

В данном примере мы сначала сохраняем текущую позицию прокрутки в переменной scrollTop. Затем, после скрытия содержимого и прокрутки страницы, мы используем scrollTo() для возвращения на сохраненную позицию прокрутки, чтобы область просмотра на экране оставалась на том же месте.

Оба этих подхода можно приспособить к вашему конкретному случаю, заменив id элементов и добавив определенные действия для кнопки "скрыть" в соответствии с вашими требованиями.
Перемещение к элементу, чтобы его видно было в окне просмотра.
Похожие вопросы