Я использую следующий код JavaScript, чтобы определить, отображается ли элемент в текущем окне просмотра или нет. Однако при этом не учитываются поля и отступы. Может ли кто-нибудь помочь мне изменить это, чтобы вернуть истину, если «реальный» элемент виден, поэтому поля и отступы игнорируются?
Актуальный JS:
(function ($) {
$.fn.visible = function (partial) {
var $t = $(this),
$w = $(window),
viewTop = $w.scrollTop(),
viewBottom = viewTop + $w.height(),
_top = $t.offset().top,
_bottom = _top + $t.height(),
compareTop = partial === true ? _bottom : _top,
compareBottom = partial === true ? _top : _bottom;
return compareBottom <= viewBottom && compareTop >= viewTop;
};
})(jQuery);
var win = $(window);
var allModifications = $(".animation-listener");
//make all elements visible that are directly visible
allModifications.each(function (i, el) {
console.info("loaded js");
var el = $(el);
if (el.visible(true)) {
el.find(".half-width-text").addClass("open");
}
});
//make elements visible that get scrolled into the viewport
win.scroll(function (event) {
var current = 1;
allModifications.each(function (i, el) {
var el = $(el);
if (el.visible(true)) {
el.addClass("animate");
}
});
});



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вместо использования height() используйте outerHeight(true). Этот метод возвращает текущую вычисленную внешнюю высоту (включая отступы, границу и, необязательно, поля) для первого элемента в наборе согласованных элементов или устанавливает внешнюю высоту каждого согласованного элемента.
http://api.jquery.com/outerheight/
getBoundingClientRect - это то, что ванильный JS делает без jQuery. знак равно
спасибо за ответ, работает нормально, но я только что обнаружил getBoundingClientRect (), который работает немного лучше для моего варианта использования :)