jquery - jQuery在滚动之前获取滚动位置以在全屏时使用scrollTop()位置临时禁用滚动
问题描述
我在网站加载时在我的网站顶部有一个全屏运行的动画。我想在动画运行期间(15 秒)禁用滚动,但仅当 Y 滚动位置等于 0 时,才能防止在站点加载 #anchors 时禁用滚动。
问题是在实际滚动之前.scrollTop()
没有输出滚动位置。
$(window).scroll(function() {
var height = $(window).scrollTop();
console.log(height); // no output before scroll
if(height === 0) {
//$("body").css({"overflow" : "hidden", "height" : "100%"}); //Lock scroll
}
});
setTimeout(function () {
$("body").css({"overflow" : "auto", "height" : "auto"});
}, 15000);
如何在滚动实际完成之前检测滚动位置?
解决方案
获取$(window).scrollTop();
文档加载时间。如果文档在 y 0 处加载,则添加事件侦听器以滚动。15 秒后,允许滚动并移除事件侦听器。
$(document).ready(function () {
let scrollHeight = $(window).scrollTop(); // Get scroll height the page loaded at
// If we loaded at 0, add the scroll event listener.
if (scrollHeight == 0) {
$(window).scroll(function () {
$("body").css({ "overflow": "hidden", "height": "100%" }); //Lock scroll
setTimeout(function () {
$("body").css({ "overflow": "auto", "height": "auto" });
$(window).unbind("scroll");
}, 15000);
});
}
});
推荐阅读
- python - 如何将 python 模块创建为单个可调用函数?
- python - 如何在python中创建表格以按列读取二维数组
- python - 当 data 参数包含 & 时如何发出 HTTP POST 请求?
- c# - Microsoft Identtiy & Identity Server 4 处理流程关系
- java - 为什么我只使用 geofirestore 获得一份文件
- graph - 单个查询中的 Cypher 遍历树
- testng-eclipse - TestNG 与 Eclipse 2019-03 不兼容
- laravel - 无法将请求参数注入刀片视图文件
- c++ - 这个 for 循环是如何终止的?
- excel - Excel VBA查找列中的最后一个非空白单元格并将其转换为值