如何禁用一个JavaScript,与内部窗口宽度

How to disable a JavaScript, with inner window width

本文关键字:内部 窗口 JavaScript 一个 何禁用      更新时间:2023-09-26

我正在制作的页面有倾斜效果,这会影响站点主体的方向。我想在页面到达移动视窗时关闭这个功能;我已经看过并尝试了一些东西,但似乎不能得到我想要的效果。下面的代码是我正在使用的。这个脚本从我的主JS代码中独立运行。

window.addEventListener("mousemove",function(e) {
  var width = window.innerWidth;
  var height = window.innerHeight;
  var clientHeight = document.body.clientHeight;
  var skew = {};
  skew.y = (20 * ((e.x / width) - 0.5));
  skew.x = -(20 * ((e.y / height) - 0.5));
  document.body.style.webkitTransform = "perspective("+clientHeight+"px) rotateX("+skew.x+"deg) rotateY("+skew.y+"deg)";
});

CSS更改不会自行删除,因此如果浏览器窗口的大小低于您期望的大小,则必须手动删除转换。

检查窗口大小,

window.addEventListener('resize', function() {
  if (window.innerWidth < 568) {
    document.body.style.webkitTransform = '';
  }
});

并且确保在用户移动鼠标时不要重新应用它。

// This is the function you already have
window.addEventListener('mousemove', function(e) {
  if (window.innerWidth < 568) {
    return;
  }
  ...
}