确定移动设备的最大浏览器高度(当地址栏未显示时)

时间:2015-04-15 14:43:31

标签: android jquery ios css mobile

我几天来一直在研究这个问题。浏览无数篇文章并尝试我所拥有的许多不同想法。

我要做的就是拥有100%浏览器高度的背景图片或元素。 问题是,只要地址栏显示并隐藏可用的空间变化,图片就会调整大小,导致恼人的跳跃。

我正在使用名为maximage 2(http://www.aaronvanderzwan.com/maximage/

的全屏图像滑块

首先,我尝试将html或body容器对齐到顶部并且120%高,这样当地址栏消失时它仍会覆盖。但是由于120%的新尺寸仍然不同,图像仍然会调整大小。

我一直在尝试存储原始浏览器高度,然后添加到该数字以补偿地址栏并将滑块调整为新大小。

我正在考虑使用设备纵横比并考虑一些固定的东西,例如宽度,但这会因设备而异,并且不可靠。

有没有人知道任何简单而干净的方法来简单地覆盖带有图像滑块的移动设备的背景而不使用会调整大小的百分比?

1 个答案:

答案 0 :(得分:0)

我遇到了同样的问题。解决方案是通过jQuery将背景高度设置为窗口高度,并在滚动事件处于活动状态时阻止调整大小事件。

这样你可以滚动让地址栏消失,并且不会发生令人讨厌的调整大小跳跃。

https://stackoverflow.com/a/31546432/1612318