Страницы

Поиск по вопросам

вторник, 20 ноября 2018 г.

Манипуляции с элементом, когда он появляется в поле зрения по центру?

Сейчас код такой:
function aboutUsAmination() { $(window).scroll(function () {
var aboutUs = $('.about_us'); var top = $(aboutUs).offset().top; var scrollFromTop = $(window).scrollTop(); if (scrollFromTop >= top) { console.log("Hello") }
});
};
В консоль выводится сообщение когда мы непосредственно доскролили до блока(то есть, он в самом верху экрана). Мне нужно, что бы хотя бы когда он по середине экрана. Можно вычислить точное число и отнимать его от top, но это нужно будет отнимать для каждого разрешения экрана. И так: Как вывести в консоль сообщение, когда блок по вертикали по центру, а не вверху


Ответ

Для этого - скорректруйте scrollFromTop на половину высоты окна, а top - на половину высоты блока:
function aboutUsAmination() { $(window).scroll(function () { var aboutUs = $('.about_us'); var top = $block.offset().top + $block.outerHeight() / 2; var scrollFromTop = $(window).scrollTop() + $(window).height() / 2; if (scrollFromTop >= top) { console.log("Hello") } }); };
При таком варианте - сообщение в консоли вы увидите, когда середина блока окажется по вертикали посередине, или выше.
Рабочий пример на jsfiddle

Комментариев нет:

Отправить комментарий