如何在Mobile上修复Skrollr?

时间:2014-04-30 13:27:10

标签: skrollr

我已经遵循移动浏览器支持指南,将内容包装在body标签之后和之前。

Explination在这里:https://github.com/Prinzhorn/skrollr#what-you-need-in-order-to-support-mobile-browsers

该网站仍然不允许页面在iPad上滚动。我不确定为什么。任何代码调查都会非常感激。

包含代码的网站http://bit.ly/1rr6zGA

2 个答案:

答案 0 :(得分:11)

您需要将所有内容包含在ID为skrollr-body的元素中。所有非位置的元素:固定;在你的CSS中进入skrollr-body元素。

From Skrollr website:

从skrollr 0.6.0开始,您只需做一件事:在页面上添加一个id为skrollr-body的元素。这是我们为了假滚动而移动的元素。你不需要#skrollr-body的唯一情况是使用position:fixed。事实上,skrollr网站并没有包含#skrollr-body元素。如果您需要固定和非固定(即静态)元素,请将静态元素放在#skrollr-body元素中。

或者换句话说:在移动设备上,使用CSS转换移动skrollr-body元素。您不能拥有位置:固定或背景附件:根据CSS规范(http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements-with-css-transforms/)修复使用CSS变换的内部元素。这就是为什么这些元素需要在skrollr-body元素之外的原因。

答案 1 :(得分:3)

我可以确认您需要在#skrollr-body中包含要滚动的内容。只添加id = skrollr-body的div将无效。 我的页面不会在移动设备上滚动。