滚动时DIV跳跃

Question

请帮助我，我变得疯狂。我有一个菜单，其中有animate = fadeindown和一个视差滑块背景，我最大的问题是当你向下滚动并向上滚动时滑块上的标题是跳跃的（看看（about.html）（我们是标题 - 当你向上滚动标题是跳跃我不知道为什么会发生这种情况）））。请帮助我，谢谢你的进步。

Answer 1

将来如果你可以在stackoverflow中粘贴有问题的代码会更容易，但这是一个非常简单的问题，我可以理解为什么可能很难理解问题的来源。

这是一个常见问题而且正在发生，因为标题.mainmenu-wrapper是regular flow的一部分，但只要您应用position: fixed（当用户滚动了一定距离时），落在常规流量之外。绝对或固定的位置元素将从常规流中取出，以便.rev_slider_wrapper向上“跳跃”以填充.mainmenu-wrapper position: fixed时margin-top留下的空间。

解决此问题的一种方法是将.mainmenu-wrapper等于固定.rev_slider_wrapper类的高度（在桌面大小的设备上查看时为~180px）到.mainmenu-wrapper类position: fixed的状态为.mainmenu-wrapper时，仅。这样，position: fixed离开常规流时（absolute或.mainmenu-wrapper.stricky-fixed + .rev_slider_wrapper { margin-top: 180px; } ）留下的垂直空间将被容纳在剩余的常规流元素中。

你可以在CSS中使用这样的东西：

+

上述选择器中的重要位是.mainmenu-wrapper。这是兄弟选择器，仅当.stricky-fixed 具有.rev_slider_wrapper类时（滚动超过某个点时）才会应用样式和是margin-top

的兄弟姐妹

我刚刚在Chrome开发工具中做了这件事，虽然它阻止了文本的跳转，但我认为你需要花一些时间来讨论转换，以确保margin-top的应用程序有点更优雅。

请注意，就所需的最少代码量而言，此解决方案是最简单，最快捷的。但是，您可能希望将具有.rev_slider_wrapper的特定类作为属性应用于.stricky-fixed，并使用与处理heroku run类的应用程序相同的JavaScript / jQuery。无论哪种方式，结果都是一样的。