Question

刚刚从SO用户那里得到了一些关于这个问题的精彩帮助：

jQuery on window scroll animate background image position

正如您在此处所见，我想在用户滚动页面时以递增方式滚动divs背景图像。查看工作版本：

http://jsfiddle.net/nicklansdell/HFxVj/4/

给出的答案完美无缺。但是，由于能够使用浏览器滚动条滚动页面，我还想要包含一些额外的功能，这些功能在单击锚点时将页面滚动到divs哈希位置。我正在使用scrollTo插件来实现这一功能，直到我包含以下CSS：

body, html {
    height: 100%;
    min-height: 100%;
}

不幸的是，如果我包含这个页面scrollTo动画不起作用但包括它允许背景图像位置动画工作，它似乎是一个或另一个，但当然我需要两个:-)任何人都可以建议解决方法在这里？非常感谢提前。

编辑*

我把问题缩小了一点。问题与身体无关，html被设置为高度100％。它给#page div一个物理高度。它需要背景图像滚动的高度为100％，但不需要指定高度来使scrollTo工作。请参阅我的JSFiddle http://jsfiddle.net/nicklansdell/HFxVj/4/更新，并使用#page样式来了解我的意思。

Answer 1

您使用$.scrollTo('selector-for-target-element', time);进行滚动吗？对于这种语法，身体的HTML中的任何一个都需要高度自动。我有类似的问题，我通过明确提到需要滚动的父div来解决。

$('parent-div-selector').scrollTo('selector-for-target-element', time);
instead of 
$.scrollTo('selector-for-target-element', time);

并且有效。

希望它有所帮助。

Answer 2

只是一个远景 - 您是否尝试将css应用于body或html而不是两者？

只有身体：

body { 
height: 100%;
min-height: 100%;
}

只有html：

html { 
height: 100%;
min-height: 100%;
}

Answer 3

仅将身高应用于身体，而非html。

jQuery scrollTo不工作体，html设置100％

3 个答案: