我有一个介绍 div,它计算浏览器窗口高度并填充屏幕,然后用户可以向下滚动到下面的主页内容。
<body>
<div id="intro"></div>
<div id="main"></div>
</body>
我使用以下 JS 来计算窗口高度并将其附加到 intro div:
resizeWindow();
$(window).resize(resizeWindow);
function resizeWindow() {
var ww = $(window).width();
var bh = $(document).height();
var wh = $(window).height();
featureHeight = wh - 0;
$('#intro').css({'height':featureHeight+'px'});
}
我试图做的是在页面滚动时减小介绍 div 的高度,一旦高度达到 0 并且用户到达主 div 内容,我可以将其删除,以便用户无法再滚动备份到它。
任何帮助将不胜感激。
最佳答案
var $intro = $('#intro');
$('#container').scroll(function(){
$intro.height($intro.height() + $intro.offset().top);
$(document).scrollTop();
if ($intro.height() <= 0) {
$intro.remove();
}
});
您实际上是从 #intro 中删除高度,直到它达到零。不过,它有点依赖于页面等于/小于 intro 元素本身。
关于javascript - 降低滚动时 div 的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25735460/