Microsoft Edge 16中的图像被压缩 - Edge中的小图像

Zet*_*eth 2 browser wordpress responsive-design srcset microsoft-edge

Microsoft Edge 16中存在一个错误(已多次报告并在此处得到确认:https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7778808/.

它将图像调整到30像素的高度.这是一个例子:

来自Microsoft Edge的Squished图像 - 小图像边缘

为什么会发生这种情况?如何解决?

Zet*_*eth 5

修复

如果您使用的是Wordpress,请将其插入functions.php-file 的底部:

/*
 * Work-around for Microsoft Edge bug ( https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7778808/ )
 */
function custom_edge_browser_fix() {
  global $is_edge;
  if( $is_edge ){
    add_filter('wp_calculate_image_srcset', '__return_false');
  }
}
add_action( 'init', 'custom_edge_browser_fix' );
Run Code Online (Sandbox Code Playgroud)

这样做可以srcset在Microsoft Edge浏览器中禁用(删除)此-tag.这可能会对Microsoft Edge中页面的加载时间产生轻微影响,但是使用该浏览器的人无论如何都没有灵魂......


说明

我在一个代理机构工作,我们在过去两天内从3个个人来源报告了这一情况,所以我认为它必须发生很多.

这个错误(据我所知)仅在Microsoft Edge中与低带宽连接有关.正如可以在错误报告中看到的那样,它似乎不是每次加载,错误发生的连接速度较慢.所以这是一个极端的案例.

srcset是一个标签,可用于显示不同大小的图像,基于加载网站时视口的大小.Wordpress会自动生成不同大小的内容,并自动生成此标记并将其放在图像上.如果删除了标记(如上面编写的代码在Microsoft Edge中),则每次都会加载原始大小的图像,而忽略视图端口的大小.

如果您收到此错误并且您没有使用WordPress,那么您可以通过srcset以另一种方式删除-tag 来绕过它...或者等待Edge 17被释放并推出.:-)

次要添加

我必须清除服务器缓存以使修复程序在某些页面上生效.人们还可以等待一段时间(比如一天左右)并让缓存自行过期.