我怎样才能让 javascript 检测不同的显示尺寸，然后根据尺寸转到网站？

Question

我最近做了一个网站，无论出于什么原因，它在移动设备上看起来很奇怪，有重叠的 Divs 等。我编码了这个：

 window.addEventListener("resize", function(){ var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; if (width <= 1632 ) window.location.replace("https://officialivytech.com/mobileindex.html"); });

因此，当 javascript 检测到 20" 英寸以下的显示器时，它将切换到该网站的移动版本。我有一个 24" 英寸的显示器，想知道如何在检测到我的 24 英寸显示器时将其恢复到正常的 index.html不是我的 20 英寸显示器。如果有人知道我会很棒。谢谢，乔希。

Answer 1

1. 英寸不用于响应式设计。 px很重要。 屏幕可以很大，但其像素值可以很低。 所以不要用英寸。

2. 当您调整浏览器大小时会触发您的功能。 如果您想在页面加载时设置所有更改，您应该创建相同的函数并在页面加载完成时调用它。

3. 为移动视图创建不同的索引文件是一种非常糟糕的做法，除非您在移动设备上隐藏了非常重的内容，或者创建了一个完全不同的网页。 几乎所有的布局和设计更改都可以而且应该在 CSS 中完成。