正文HTML高度100％

Question

当我尝试将html，body设置为100％高度时，所有依赖滚动位置的jquery脚本都会停止工作。 为什么是这样？ http://creativelycoded.com/demos/Astonish/one-page/index.html

这是我的网站。 如果使用检查元素并添加100％的高度，您将明白我的意思。

我需要100％的高度才能获得背景尺寸：保护套才能在iPhone和iPad上正常工作。 现在，背景图像会缩放到文档的整个高度。 但是，当我向html和body添加100％的高度时，它们可以正确缩放，但是我的脚本搞砸了。

任何帮助将不胜感激。

谢谢约翰

Answer 1

您不能将HTML或body设置为height：100％并使用基于滚动位置的脚本。 scrollTop（）不再起作用

尝试html, body{ height:100vh; } html, body{ height:100vh; }

这是在CSS3中使用新的vh单位，这意味着100％的视口高度。 它适用于现代浏览器。

支持表： http : //caniuse.com/#feat=viewport-units

Answer 2

我相信将高度设置为100％意味着将没有滚动条，因此也没有滚动位置。

如果设置css：

html{ overflow-y: scroll; }

它可能会解决它。

Answer 3

在您的html代码中添加样式，例如style="height:100%"