【问题标题】:jQuery scrollTo not working body,html set 100%jQuery scrollTo 无法正常工作,html 设置为 100%
【发布时间】:2011-07-01 05:21:58
【问题描述】:

刚刚从 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 样式来了解我的意思。

【问题讨论】:

  • 小提琴中看不到动画代码。另一方面 - 我也没有在 Html 区域看到任何内容。我应该看到吗?
  • @Niklas 抱歉,我正在玩弄代码,并把所有的 scrollTo 引用都拿出来了。我已将它们放回原处并缩小了问题范围,请参阅上面的编辑。
  • 抱歉,我暂时没有任何想法,祝你好运!

标签: jquery css hash anchor scrollto


【解决方案1】:

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

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

它成功了。

希望对你有帮助。

【讨论】:

    【解决方案2】:

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

    只有身体:

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

    只有 html:

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

    【讨论】:

    • 非常感谢您的建议,但不幸的是它不起作用
    【解决方案3】:

    只将高度应用到正文,而不是 html。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-04-14
      • 2017-08-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-11-13
      相关资源
      最近更新 更多