gpt4 book ai didi

Javascript滚动和窗口调整大小

转载 作者:行者123 更新时间:2023-11-30 17:01:13 24 4
gpt4 key购买 nike

我有一个名为 navbar 的 div 类,我想在页面向下滚动 700 像素时淡入。但是,当页面宽度小于600px时,我不想显示。有什么想法吗?

$(window).addEventListener('onresize',function(){ 
$(window).scroll(function (e) {
e.preventDefault();
if ($(this).scrollTop() > 700 & window.innerWidth > 600) {
$('.navbar').fadeIn();
}
else {
$('.navbar').fadeOut();
}
});
});

最佳答案

您不需要为“onresize”添加监听器,window.innerWidth 是动态的,因此它会随着调整大小而变化。

$(window).scroll(function (e) {
e.preventDefault();
if ($(this).scrollTop() > 700 && window.innerWidth > 600) {
$('.navbar').fadeIn();
}
else {
$('.navbar').fadeOut();
}
});

或者您可以分成两部分,以防您在不滚动的情况下调整大小。

function listener (e) {
e.preventDefault();
if ($(window).scrollTop() > 700 && window.innerWidth > 600) {
$('.navbar').fadeIn();
}
else {
$('.navbar').fadeOut();
}
}
$(window).scroll(listener);
$(window).resize(listener);

关于Javascript滚动和窗口调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28823231/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com