javascript – 删除浏览器宽度的功能

2023年1月13日 150次阅读

我仍然是
javascript的新手,我正在学习.这可能是一个简单的修复但是如何在较小的宽度上禁用我的视差图像上的函数(或者通常禁用特定的js函数)？

这是我到目前为止所做的不太有效,但显示“未定义”.我一直在寻找一个解决方案,现在没有运气.任何帮助,将不胜感激.

  var paraLlaxS = document.querySelector("#firstImgc2");
  var paraLlaxS = document.querySelector("#secondImgc2");
  var paraLlaxS = document.querySelector("#backbox1");

  function setTranslate(xPos, yPos, el) {
      el.style.transform = "translate3d(" + xPos + ", " + yPos + "px, 0)";
  }

  window.addEventListener("DOMContentLoaded", scrollLoop, false);

  var xScrollPosition;
  var yScrollPosition;

  function scrollLoop() {

      xScrollPosition = window.scrollX;
      yScrollPosition = window.scrollY;

      setTranslate(0, yScrollPosition * -0.2, firstImgc2);
      setTranslate(0, yScrollPosition * 0.15, secondImgc2);
      setTranslate(0, yScrollPosition * -0.6, backbox1);

      requestAnimationFrame(scrollLoop); 


      if(window.innerWidth < 900) {
        document.querySelector('#firstImgc2').innerHTML = window.removeEventListener("DOMContentLoaded", scrollLoop, false);
        return;
      } else {

      }
}

最佳答案 您可以在函数开头添加条件返回.但是如果宽度再次增加,你需要监听它再次启动循环.

function scrollLoop() {
   if(window.innerWidth < 900)return;
   ...
点赞