在Instagram应用内浏览器裁剪方面有什么解决方法? [英] Any workaround on Instagram in-app browser cropping?

问题描述

Instagram在今年某个时候发布了他们的应用内浏览器(网络视图)的更新，至少在iOS中，它破坏了大多数网站.

Instagram released (at some point this year) an update on their in-app browser (webview) that at least in iOS, breaks most sites.

附件图像是单击广告上的了解更多信息"后打开的网站，但在Profile Bio链接上也具有相同的行为.

The attached image is the website opened after clicking the "Learn more" on an Ad, but has the same behavior also on Profile Bio links.

有问题吗?似乎顶部栏是网站上的覆盖图，使大多数移动设备导航(左上角的汉堡图标)无法使用/无法点击和/或隐藏.

The problem? It seems the top bar is an overlay on the website, making most navigations for mobile (hamburger icon on top left corner) unusable/unclickable and/or hidden.

innerHeight与screen.height相同.如如何调整html/instagram应用内浏览器的CSS布局?我们可以嗅探Webview的用户代理.

The innerHeight is the same as screen.height. As answered at How to adjust html/css layout for instagram in-app browser? we can sniff the user agent of the webview.

不确定他们是否会在某个时候解决它，但似乎任何填充类的解决方案都将在这种情况下失效.

Unsure if they will fix it at some point, but seems that any padding-top kind of solution would break if they do.

推荐答案

我发现，从理论上讲，当他们发布适当的修复程序时，它应该不会中断(鉴于目前有大量广告指向的站点已损坏:)

I have found out an alternative that in theory should not break when they release a proper fix (given tons of ads are pointing to broken sites currently:)

if (window.innerHeight === window.screen.height && navigator.userAgent.match(/instagram/i)) {
  // here apply the fixes
}

这篇关于在Instagram应用内浏览器裁剪方面有什么解决方法?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！