Как реализовать скроллинг на JavaScript, чтобы блок находился точно посередине экрана?

Question

Леонора

javascript

Как реализовать скроллинг на JavaScript, чтобы блок находился точно посередине экрана?

Как можно настроить скролл так, чтобы при нажатии на ссылку блок смещался и располагался по центру экрана, а не в верхней части?

21 марта 2024 г. 12:49

Ответы на вопрос 1

Похожие вопросы

Answer 1

Для реализации скроллинга на JavaScript, чтобы блок находился точно посередине экрана, можно использовать следующий код:

```javascript
function scrollToCenter(elementId) {
    var element = document.getElementById(elementId);
    var offsetTop = element.offsetTop;
    var halfHeight = window.innerHeight / 2;
    window.scrollTo(0, offsetTop - halfHeight);
}

scrollToCenter('blockId');
```

Для настройки скролла так, чтобы при нажатии на ссылку блок смещался и располагался по центру экрана, можно использовать следующий код:

```javascript
document.getElementById('linkId').addEventListener('click', function() {
    var element = document.getElementById('blockId');
    var offsetTop = element.offsetTop;
    var halfHeight = window.innerHeight / 2;
    window.scrollTo(0, offsetTop - halfHeight);
});
```

Этот код добавляет слушателя события на ссылку с id "linkId", который при клике на ссылку выполняет скроллинг к блоку с id "blockId" так, чтобы он был расположен по центру экрана.