Javascript 在更改分辨率时，如何防止棋盘格占据我们的视野？

所以我现在正在做一个需要网格/棋盘的项目。我已经用Javascript创建了我的网格，并且我还设法将网格居中

我遇到的问题是，当我用设备工具栏更改分辨率时，网格会消失在视野之外。我的目标是使整个网格可见，无论我使用什么电话或计算机

谢谢你们的帮助

这就是我制作网格的方式。

for (i = 0; i < row; i++) {
    grid[i] = new Array(col);
}

//making a spot for every grid.
for (i = 0; i < row; i++) {
    for (j = 0; j < col; j++) {
        grid[i][j] = new Spot(i, j);
    }
}

    function Spot(i, j) {
this.x = i;
this.y = j;

this.show = function (color) {
    fill(color);
    rect(this.x * w, this.y * h, w - 1, h - 1);

}

}

w是单个网格的宽度，h是单个网格的高度。col和row是我希望网格具有的行和列的数量

我还调用函数“this.show”每帧。结果如下所示：

---

您需要对照媒体类型进行检查：

var l_strMobileMedia = '(max-width:320px)'
        var mqList = window.matchMedia(l_strMobileMedia);
        if(!mqList.matches){
            l_strMobileMedia = '(max-width:481px)'
            mqList = window.matchMedia(l_strMobileMedia);
        }   

        if(!mqList.matches){
            l_strMobileMedia = '(max-width:768px)'
            mqList = window.matchMedia(l_strMobileMedia);
        }   

        if(s_bIsMobile == null || s_bIsMobile != mqList.matches){
            Session.set_mobile_layout(mqList.matches);
        }
        s_bIsMobile = mqList.matches;
        return mqList.matches;

---

我希望这能让你开始。如果您想实时执行此操作，则需要钩住窗口大小调整事件或设置一个计时器来为您执行查询

请做一些关于响应用户界面的研究。您没有提到您使用的任何技术，也没有显示任何代码，因此很难提出任何有用的答案。欢迎来到stackoverflow

@gabbe 1237

。我们需要更多的信息来帮助你。请查看请添加您的代码并尝试。rect的作用是什么？你在用图书馆吗？这是否在网页/HTML上？在

画布上绘制

？目前还不清楚您使用哪种输出技术和元素。