Freewall jQuery Plugin - 在移动设备上查看，某些图块的宽度设置为零答案

【问题标题】：Freewall jQuery Plugin - Viewing on mobile, certain tiles get width set to zeroFreewall jQuery Plugin - 在移动设备上查看，某些图块的宽度设置为零
【发布时间】：2015-11-25 11:13:01
【问题描述】：

我在使用 Freewall jquery 插件时遇到了一些问题，这很奇怪。

基本上，当我将页面加载到屏幕尺寸超过大约 580 像素的任何东西上时，网格工作得非常好。但是，如果我在移动设备的屏幕尺寸（大约小于 580 像素）上加载页面，则 90% 的图块宽度会设置为零，当然会破坏网格布局。

此外，在移动设备上加载页面或使用移动设备尺寸后调整视口大小时，损坏的网格图块仍然没有设置为零以外的宽度！

这相当令人困惑，因为一切正常，然后突然之间，他们开始这样做。

我尝试过回溯我的步骤，看看我在设置完之后所做的某件事是否破坏了它，但没有任何效果。

我在 giphy 上制作了一个 gif，显示了我想说的话。正如他们所说，一张图片能说出一千个单词。 :)

另外，这是我的 Freewall 功能：

// FreeWall Grid Settings
    $(function() {
    var wall = new freewall(".grid_container");
    wall.reset({
        fixSize: false,
        animate: true,
        cache: true,
        cellW: 292.5, // These are what saved the day!
        cellH: 284, // These are what saved the day!
        gutterX: 1,
        gutterY: 1,
        onResize: function() {
            wall.fitWidth();
        }
    });
    wall.fitWidth();

});

谢谢大家。

GIF 链接：http://gph.is/1lhoXWe

【问题讨论】：

标签： jquery responsiveness freewalljs

【解决方案1】：

我最终通过更改一些 CSS 解决了这个问题。特别是网格图块的高度。

FreeWall 不高兴我似乎没有设置高度，所以我添加了一个最小高度规则，问题就解决了。

【讨论】：

【解决方案2】：

如果其他人像我一样在这里结束 - 我的问题是我给的 CellW 是 300 - 当我到达某个点时，项目的宽度为 0 - 更窄（导航消失的地方）有更多的空间，所以 300 工作。答案是将 cellW 设置为 200 - 就像一个魅力

【讨论】：