仅当最小宽度为800px时才执行Javascript

  • Z时代
  • 2024-01-10
  • 分类：问答

对于我的项目，只有在屏幕尺寸等于或大于800像素的情况下，我才需要视差滚动效果。要做到这一点，我写了下面的代码：仅当最小宽度为800px时才执行Javascript

<script> 
    if (window.screen.width >= 800) { 
     function parallax() { 
      var parallax = document.getElementById("box01"); 
      parallax.style.top = -(window.pageYOffset/4) + "px"; 
     } 
    } 
    window.addEventListener("scroll", parallax, false); 
</script>

视差滚动工作正常，但“window.screen.width”命令是由浏览器忽略。意思是：视差滚动也可用于小于800px的屏幕。

任何帮助表示赞赏！

回答：

是window.matchMedia。

function executeIfMinWidth800 (e) { 
    if (window.matchMedia('(min-width: 800px)').matches) { 
    // do stuff 
    } 
} 
// call initially 
executeIfMinWidth800(); 
// add handler for resize 
window.addEventListener('resize', executeIfMinWidth800);

回答：

window.screen得到你的大小显示器。

你想要什么视的大小，通过访问：你在找什么

// width 
window.innerWidth 
// height 
window.innerHeight

回答：

现在你应该试试这个

if (window.matchMedia('(min-width: 800px)').matches) { 
    function parallax() { 
     var parallax = document.getElementById("box01"); 
     parallax.style.top = -(window.pageYOffset/4) + "px"; 
    } 
} else {}; 
window.addEventListener("scroll", parallax, false);

以上是 仅当最小宽度为800px时才执行Javascript 的全部内容， 来源链接： utcz.com/qa/257555.html

回到顶部