我有一个功能,可以让容器在滚动100px时跳到顶部,并在再次滚动到顶部时跳回原位。我正在努力在较小的设备上禁用此功能,但是我使用的代码也破坏了行为。
$(window).scroll(function() {`
//After scrolling 100px from the top...
if ( $(window).scrollTop() >= 72 || w > 920 ) {
$('#container').css('top', '0px');
//Otherwise remove inline styles and thereby revert to original stying
} else {
$('#container').attr('style', '');
}
});
更新:当您再次滚动到顶部时,此代码实际上应该使容器跳到先前的位置。问题出在“ w> 920”。我需要禁用较小设备上的行为,但这也会破坏功能。我猜是因为有“ AND”语句。窗口宽度保持不变,因为恢复中断。
不工作的小提琴
https://jsfiddle.net/xm1yq4to/
工作小提琴
https://jsfiddle.net/s15g7nup/
还有另一种方法可以为此指定设备宽度吗?
答案 0 :(得分:0)
我最终以另一种方式进行了操作,即不检查设备而是更改类
$(document).ready(function() {
// run test on initial page load
checkSize();
// run test on resize of the window
$(window).resize(checkSize);
});
//Function to the css rule
function checkSize(){
if ($(".desktop-menu").css("display") == "block" ){
$(window).scroll(function() {
//After scrolling 100px from the top...
if ( $(window).scrollTop() >= 100 ) {
$('#container').css('top', '0px');
}
//Otherwise remove inline styles and thereby revert to original stying
else {
$('#container').attr('style', '');
}
});
}
return false;
};