我正在建立一个网站,并且我正在使用媒体查询来使网站对移动设备做出响应。在我的网站的桌面版本上,我使用以下Javascript在100px向下滚动时使2个div淡入/淡出。
$(document).scroll(function () {
var y = $(this).scrollTop();
if (y > 100) {
$('#firstHeadingLeft, #firstHeadingRight').fadeIn(3000);
} else {
$('#firstHeadingLeft, #firstHeadingRight').fadeOut();
}
});
现在的问题是,我不希望这个javascript在我的移动设备上处于活动状态,我希望2个div始终存在。我做了一些搜索,发现了这个
How to disable JavaScript in media query
其中一个建议是使用此代码添加事件侦听器
window.addEventListener('resize', function(){
if(window.innerWidth > 568){
...execute script
}
});
但是因为我不能流利使用javascript,所以我不确定如何正确地将我的代码包装到事件监听器代码中。
如果有人能给我一只手,我将不胜感激! - 谢谢!
答案 0 :(得分:0)
这应该可行,但我无法测试它。告诉我会发生什么:)
window.addEventListener('resize', function(){
disableScript();
});
window.addEventListener('load',function(){
disableScript();
});
function disableScript(){
if(screen.width > 568){
//...execute script
}
}