JS检测DIV高度屏幕左侧

下方所以，我有一个HTML标记如下：JS检测DIV高度屏幕左侧

还有就是几乎涵盖了首页的整个高度一个div。但是高度是动态生成的。

当用户滚动DIV下来，如果有100像素左右可视屏幕下方的div，我想触发一个动作（例如，警报）。

由于屏幕尺寸的变化，我需要简单检测多少股利留在屏幕下方的方式。

的事情是，我不想不断地测量高度变化，可能是“硬”在用户端。

一个想法是，也许我将在这个主要的div的最后一个“隐藏”的div，而当它在观点，那么我就会触发一个动作。

正如你所看到的，我不知道最好的方法是什么这个目的。

如果您需要澄清，请让我知道。

谢谢！

来源

2016-03-06 steve Kim

var div = document.getElementsByTagName('div')[0]; 
 

 
window.addEventListener("scroll", function() { 
 
    if (window.pageYOffset + window.innerHeight - (div.offsetTop + div.scrollHeight) > -100) { 
 
    alert('Less than 100px of div remains below viewport'); 
 
    } 
 
});

body { 
 
    height: 2000px; 
 
} 
 
div { 
 
    background-color: lightblue; 
 
    height: 1000px; 
 
}

<div></div>

window.pageYOffset是从顶部当前滚动位置，
window.innerHeight是视口的高度，
div.offsetTop是div的从顶部位置，
div.scrollHeight是高度为div。

整个if代表滚动超出了div的底部的像素数。超出底部意味着剩下100px。

来源

2016-03-06 20:34:57 Przemek

JS检测DIV高度屏幕左侧

回答

相关问题