.isInView()

Viewport

Проверить, видим ли элемент в данный момент в окне просмотра.

isInView(element [, offsetTop, offsetLeft])

Метод .isInView() может быть полезен при работе с текущим окном просмотра. Данный метод проверит, видим ли элемент в данный момент в окне просмотра, появляется ли элемент в поле зрения при прокрутке.

Параметр Тип Описание
element Node Элемент HTML.
offsetTop Number Смещение сверху.
offsetLeft Number Смещение слева.

Примеры использования

Проверим, находится ли элемент внутри области просмотра.

<div id="example" class="uk-card uk-card-primary uk-card-body"></div>
const myElement = util.$('#example');

console.log(util.isInView(myElement))

Результат

true

Проверим, появляется ли элемент в поле зрения при прокрутке.

util.on(window, 'scroll', function () {
  if (util.isInView(myElement)) {
    console.log('Элемент виден!')
  } else {
    console.log('Элемент совершенно не виден!')
  }
});

Результат

'Элемент виден!'

Если нужно определить присутствие элемента на странице, отображается элемент в документе или скрыт, то обрати внимание на функцию JavaScript UIkit.util.isVisible().