我需要检测某些 div 的底部边框何时触及视口(viewport)底部,然后触发某些功能。我试过这个
jQuery(function ($) {
$.fn.isOnScreen = function(){
var win = $(window);
var viewport = {
top : win.scrollTop(),
left : win.scrollLeft()
};
viewport.right = viewport.left + win.width();
viewport.bottom = viewport.top + win.height();
var bounds = this.offset();
bounds.right = bounds.left + this.outerWidth();
bounds.bottom = bounds.top + this.outerHeight();
return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
};
$(window).scroll(function() {
if ($('.gallery full-width-container').isOnScreen() == true) {
$('.portfolio-description-showinfo').addClass('testing');
}
});
});
但是这个函数检测到 div 何时进入视口(viewport),而不是当 div 的底部位于视口(viewport)底部时。任何提示,帮助?谢谢。
最佳答案
试试这个:
$(window).scroll(function() {
if ($('.gallery full-width-container').isOnScreen() == true) {
if ($(".portfolio-description-showinfo").offset().top + $(".portfolio-description-showinfo").height()) >= $(window).height() {
$('.portfolio-description-showinfo').addClass('testing');
}
}
});
关于javascript - 在视口(viewport)上检测,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46485204/