android - 移动Webkit浏览器(chrome)地址栏变化 $(window).height();使背景大小为 :cover rescale every time

标签 android google-chrome mobile scale background-size

问题是我有几个绝对定位的 DIV,它们具有 background-size: cover;它们的高度由 javascript 计算以填充 100% 的视口(viewport)。在每个桌面浏览器和移动 firefox 上一切都很好,但在移动 chrome 地址栏上(出现/消失时)更改 $(windows).height();值(value)。每次这样做时,都会导致古怪的背景图像重新缩放。是否有一种解决方法可以始终显示地址栏(因此窗口高度值不会改变),或者其他一些保持背景大小的解决方案:cover;无论地址栏如何,缩放都相同?

最佳答案

我知道你说的是 Chrome,但对于 iOS 7.1 的新移动版 Safari,你可以将属性添加到视口(viewport)标签“minimal-ui”,这将阻止导航栏和地址栏从弹出和弹出。

希望将来其他浏览器(例如 Mobile Chrome)也能接受此值。

您可以在这里阅读更多内容: http://www.mobilexweb.com/blog/ios-7-1-safari-minimal-ui-bugs

关于android - 移动Webkit浏览器(chrome)地址栏变化 $(window).height();使背景大小为 :cover rescale every time,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24479085/

相关文章:

css - 如何在浏览器中轻松比较样式?

android - 您如何制作跨平台的移动应用程序并最大程度地减少编写冗余代码?

Android Firebase 分析不工作

javascript - Joomla 更新后一个文件出现 ERR_CONTENT_DECODING_FAILED

html - 在 Chrome 63 中禁用自动填充

asp.net-mvc - asp.net mvc 4 中移动设备的显示模式和 ipad 的桌面 View

ios - 当您在 iOS 应用程序和服务器中都使用 token 时如何处理 Facebook 弃用的离线访问权限

android - 如何在 Kotlin 中为菜单项添加点击监听器

SwitchPreferenceCompat 自定义布局的 Android id

java - 在子类中设置一些属性后调用父类(super class)方法的实现