Chrome element.style 裁剪图像

Question

正如您在图片中注意到的那样，Chrome 正在将所选 div 的高度调整为 55 像素。这是 element.style，我认为它是由脚本计算并插入到 html 中的。 55px 不正确，因为它会截断图像，所以我想将其设为 305px。奇怪的是，这只发生在 Chrome 中并且适用于 IE 和 Firefox。另外，当我在计算机 Chrome 中本地处理 html 页面时，也不会发生这种情况。我试图通过使用 !important 来覆盖 55px CSS 规则，但这没有做任何事情。我清除了浏览器 cache/cookies 并重新上传了文件，但没有任何结果。当您将浏览器 window 变小然后再次全屏时，Chrome 似乎会自行更正并正确显示。任何帮助表示赞赏。

Answer 1

在/js/main.js文件中

更改此代码：

$container.isotope({
    itemSelector: '.isotopeItem',
    resizable: false, // disable normal resizing
    masonry: {
        columnWidth: $container.width() / $resize
    }
});

收件人：

$container.imagesLoaded( function() {
    $container.isotope({
        itemSelector: '.isotopeItem',
        resizable: false, // disable normal resizing
        masonry: {
            columnWidth: $container.width() / $resize
        }
    });
});

这有望使同位素等待图像加载。

编辑： Imagesloaded 不再包含在同位素的最新版本中。你有一个包含 Imagesloaded 的旧版本，但如果你要升级到一个新版本，你将不得不使用这个：http://imagesloaded.desandro.com/

Chrome element.style 裁剪图像

Chrome element.style cutting off images

javascript

css

google-chrome

developer-tools