Question

Heyo，

所以我想知道是否有可能显示div的淡入淡出效果，如果它在当前屏幕视图中距离底部20％。因此，例如，如果向下滚动页面并且以下内容框的屏幕高度的20％到屏幕底部，则淡入效果会运行。

我想要这个因为响应功能。每次Screensize改变时，我都不想为淡入淡出效果写一个新的像素高度。

这是我目前正在使用的代码：

function Scroll(){
var top = document.getElementById('div1');
var ypos = window.pageYOffset;
    if (ypos > 1000){
        top.style.opacity = "1";
    }
    else {
        top.style.opacity = "0";
    }
}
window.addEventListener("scroll",Scroll);

Answer 1

你看过滚动结合位置和高度吗？ https://api.jquery.com/scroll/和https://api.jquery.com/position/在滚动条上，您可以获得相关元素的位置并与窗口进行比较。 http://api.jquery.com/height/和How to get the 'height' of the screen using jquery这些应该是您需要的所有工具。

当距离屏幕底部20％时显示div

1 个答案: