@Richswitch
junior

Вычислить координаты элемента относительно окна?

Привет!
Я уже не соображаю совсем. Поэтому вопрос к вам...
Добавляю анимацию к элементам при прокрутке с помощью onscroll и проверки. Проверка будет такой:
- если окно прокрутилось больше чем на 300px от верхней точки элемента
- то добавить анимацию

Код такой:
<div class="item "></div>
  <div class="item "></div>
  <div class="item "></div>

var getCoord = document.getElementsByClassName('item');

document.onscroll = function(e) {
	scrollAdd();
};

function scrollAdd() {
	var elemCoords = getCoord[0].getBoundingClientRect().top;
	console.log(getCoord[0].getBoundingClientRect().top + '   1 element');
	console.log(window.pageYOffset + '   offset');
         
        var someVar =  ****Здесь должно что-то быть**** ;

	if (someVar > 300) {
		console.log('if');
		getCoord[0].classList.add('animation');
	}
};

972a41f7b7f04102898ade1f31200a78.png

UPD сами элементы имеют высоту 370px т.е. элмент должен показаться > чем на 150px
  • Вопрос задан
  • 1348 просмотров
Решения вопроса 1
DirecTwiX
@DirecTwiX
"display: flex;" уже предлагали?
innerHeight - высота экрана

var scrollPos = window.scrollY || window.scollTop || document.getElementsByTagName("html")[0].scrollTop;

столько проскролил пользователь

if (scrollPos + window.innerHeight > el.centerY) addAnimation()
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы