Добрый день, есть прелоадер, белый фон с лого по середине, когда страница загрузилась, фон пропадает, и лого должно улетать в хедер по координатам того, что там уже стоит, так вот, с помощью getBoundingClientRect(), я получил координаты лого в хедере, и пытаюсь логотипу который в центре на прелоадере задать через style.top и style.left значения из getBoundingClientRect(). Но они остаются пустыми, не понимаю почему
let preloader = document.querySelector('.preloader')
window.onload = function () {
document.body.classList.add('loaded_hiding');
flyLogo();
window.setTimeout(function () {
preloader.hidden = true;
// document.body.classList.add('loaded');
// document.body.classList.remove('loaded_hiding');
}, 2500);
}
function flyLogo() {
let logo_header = document.querySelector('.js-logo');
let header_coordinats = logo_header.getBoundingClientRect();
let logo_preloader = document.querySelector('.preloader__logo')
let preloader_coordinats = logo_preloader.getBoundingClientRect();
let x_header = header_coordinats.top
let y_header = header_coordinats.left
console.log(x_header)
let width_header = header_coordinats.width
let height_header = header_coordinats.height
let x_preloader = preloader_coordinats.x
let y_preloader = preloader_coordinats.y
logo_preloader.style.top = y_header;
logo_preloader.style.left = x_header;
logo_preloader.style.width = width_header
logo_preloader.style.height = height_header
logo_header.style.background = '#fff';
console.dir(logo_preloader)
console.dir(logo_header)
}
В консоли
console.log(logo_preloader.style.top) - пустая строка
console.log(y_header) - 20