Skrollr相对模式在Chrome或Safari中无法正常工作

Question

我正在使用相对模式通过Skrollr插件（ https://github.com/Prinzhorn/skrollr ）开始和结束动画。 一切在IE中都可以正常运行，但动画早在Safari和Chrome中出现，而后在Firefox中出现。 我以数据底部为起点，以数据中心为终点。 因此，当整个元素只是从视口底部弹出时，动画应从右开始，并应在视口的中央结束。

在该网站上，您可以看到动画的出现在“为什么要为妈妈服务”部分的div id =“ div56709”下。

http://group.com/womens-ministry/where-moms-connect

对于为什么出现上述问题的任何想法将不胜感激。

Answer 1

因此，当整个元素只是从视口的底部弹出时，动画应该从正确的位置开始

好吧，不完全是。 data-bottom是data-bottom-bottom缩写，表示元素的底部在视口的底部。 您所描述的是data-bottom-top 。

我在Firefox和Chrome浏览器中尝试过，它看起来像预期的那样。

您可以尝试的一件事是在window.onload上调用refresh() 。 这将重新计算相对模式。 也许当您调用init() ，有一些未加载的图像使内容向下移动（即使您在img元素上显式设置了width和height ）。

编辑：实际上，我只是验证了这是问题所在。 您可以通过按ctrl + f5强制重新加载进行验证。 动画将关闭。 如果现在调整浏览器的大小（在内部触发refresh ），它将起作用。