Javascript窗口大小调整不在加载时触发

我正在使用一个特定的代码笔，可以在这里找到。。不是我的

除了在手机上打开页面或将浏览器宽度更改为手机大小时，它仍然会以浏览器窗口宽度以外的方式显示某些项目，是否有任何方法可以检测手机或屏幕大小的变化，并将其向下显示

以下是代码笔中的调整大小代码（如果有帮助）

$(window).resize(function(){
    var margin=40;
    var padding=15;
    var columns=0;
    var cWidth=300;
    var windowWidth = $(window).width();

    var overflow = false;
    while(!overflow){
        columns++;
        var WidthTheory = ((cWidth*columns)+((columns+1)*padding)+margin);
        if(WidthTheory > windowWidth)
            overflow = true;            
    }       
    if(columns > 1)
        columns--;

    var GridWidth = ((cWidth*columns)+((columns+1)*padding)+margin);

    if( GridWidth != $('#grid').width()){
        $('#grid').width(GridWidth);
    }
});

---

任何帮助都将不胜感激

使用Maximize、Minimize或Chrome DevTools设备按钮等调整大小。这些按钮不会正确触发调整大小事件（它会在实际调整大小之前触发，因此无法获得正确的大小）

对于移动页面加载，将相同的代码从窗口大小调整功能放入文档准备功能（我建议将其设置为函数，然后在两者中调用该函数以减少重复代码）：

有关最小-最大值等，请参阅此stackoverflow线程：

这个答案特别有助于：

$(window).resize(function()
{   
    setTimeout(function() {
        setDisplayBoardSize();
    }, 100);
});

---

非常好，非常感谢你的帮助

$(window).resize(function()
{   
    setTimeout(function() {
        setDisplayBoardSize();
    }, 100);
});