offsetTop можно ли использовать
 

Прочитал что этот метод устарел, и я не понял он что стал не рабочим или как с var его заменили на let но его до сих пор без проблем можно писать.

Если устарел то чем его заменить.

И там написано что он просчитывает от родителя, родитель определяется версткой?

прочитал понял, но не понял что значит устарел

Где прочитали?

Сергей Ракипов, там говорится не о том, что метод offsetTop устарел. Там говорится о том, что более нет никакой нужны получать координаты блока на странице с помощью суммирования offsetTop всех родительских элементов блока, т.к. появился метод getBoundingClientRect, который делает это проще и точнее названного выше варианта.

Надеюсь понятно объяснил.

Буду разбиратся с этим getBoundingClientRect

Почему не сработало

const imgArticle = document.querySelector(".img_article");

function onScroll() {
  let posTop = imgArticle.getBoundingClientRect().top;
  
  if(posTop = 0) {
	  imgArticle.style.display = "fixed";
  }
}

document.addEventListener("scroll", onScroll);

console.log(imgArticle.getBoundingClientRect().top);

У меня есть блок который достигает вверх страницы и должен зафиксироваться

Сергей Ракипов,
6 строка

так говорится что когда переменная posTop приобретет значение 0 то нужно сделать...

а точно не присвоить а равенство ==

let imgArticle = document.querySelector(".img_article");

function onScroll() {
  let posTop = imgArticle.getBoundingClientRect().top;
  
  if(posTop >= 0) {
	  imgArticle.style.display = "fixed";
  }
}

document.addEventListener("scroll", onScroll);

console.log(imgArticle.getBoundingClientRect().top);

все равно не сработало

Все я все понял, увидел грубую ошибку в css простите что занимаю ваше время своей не внимательностью

let imgArticle = document.querySelector(".img_article");

function onScroll() {
let scrollTop = document.querySelector("body").getBoundingClientRect().top;


if(scrollTop >= 0 & scrollTop <= -220){
	imgArticle.style.position = "absolute";
	imgArticle.style.top = "0";
}
else if(scrollTop >= -220 & scrollTop <= -500){
	imgArticle.style.position = "fixed";
	imgArticle.style.top = "0";
}
else{
	imgArticle.style.position = "absolute";
	imgArticle.style.top = "280" + "px";
}

console.log(scrollTop);
}

document.addEventListener("scroll", onScroll);

Скажите я условия что ли не правильно пишу, у меня сразу else переходит

Отрицательные значение как то по другому пишутся

:yes:

Точно забыл что больше, а что меньше в математике со значением минус.

Сергей Ракипов,

рони,
Спасибо я разобрался