javascript - Chrome 和火狐浏览器 : pictures stick together

Question

我的新 website 遇到了问题. 一些网格图片粘在一起，但仅在 Firefox 和 Chrome 中。 如果我放大到 110% 并缩小到 100%，问题就不会出现。 另外，如果我清除缓存并重新加载，问题就不存在了。

你们有没有解决这个问题的想法。

还有问题的图片:

我认为 masonry.js 有问题。但我不知道如何解决这个问题。

(function ($) {
    var $container = $('.masonry_wrapper'),
        colWidth = function () {
            var w = $container.width(), 
                columnNum = 1,
                columnWidth = 0;
            if (w > 1200) {
                columnNum  = 5;
            } else if (w > 900) {
                columnNum  = 4;
            } else if (w > 600) {
                columnNum  = 3;
            } else if (w > 300) {
                columnNum  = 2;
            }
            columnWidth = Math.floor(w/columnNum);
            $container.find('.item').each(function() {
                var $item = $(this),
                    multiplier_w = $item.attr('class').match(/item-w(\d)/),
                    multiplier_h = $item.attr('class').match(/item-h(\d)/),
                    width = multiplier_w ? columnWidth*multiplier_w[1]-4 : columnWidth-4,
                    height = multiplier_h ? columnWidth*multiplier_h[1]*0.5-4 : columnWidth*0.5-4;
                $item.css({
                    width: width,
                    height: height
                });
            });
            return columnWidth;
        }

        function refreshWaypoints() {
            setTimeout(function() {
            }, 1000);   
        }

        $('nav.portfolio-filter ul a').on('click', function() {
            var selector = $(this).attr('data-filter');
            $container.isotope({ filter: selector }, refreshWaypoints());
            $('nav.portfolio-filter ul a').removeClass('active');
            $(this).addClass('active');
            return false;
        });

        function setPortfolio() { 
            setColumns();
            $container.isotope('reLayout');
        }

        isotope = function () {
            $container.isotope({
                resizable: true,
                itemSelector: '.item',
                masonry: {
                    columnWidth: colWidth(),
                    gutterWidth: 0
                }
            });
        };
    isotope();
    $(window).smartresize(isotope);

}(jQuery));

对不起我的英语。

非常感谢您。

Answer 1

可能是因为你连接的是砖石而不是同位素