【问题标题】:javascript effectjavascript效果
【发布时间】:2012-01-27 21:54:28
【问题描述】:

我注意到 9gag.com 上有这个功能。在主页上,“您无需注册”按钮位于右侧。但是当您向下滚动时,该按钮会挂在标题横幅上。这是怎么做的??这也可以在此页面上看到,当您向下滚动此页面时,右侧的黄色面板(类似问题)会冻结。在 facebook 时间线中,当您向下滚动时,将有一个绝对 div 出现在顶部,其中包含时间线、现在、状态、照片、地点和事件的选项。

他们使用 javascript 还是 html5 中的新功能??

【问题讨论】:

  • 你试过自己搜索吗?尝试改进您的搜索字词(Javascript 效果实际上并不能描述当用户向下滚动时不移动的元素),花更多的时间和精力来询问您的问题以修复明显的错字并接受旧的答案。体面的人会努力回答你的问题,至少你能做的就是正确地问他们:)

标签: javascript html


【解决方案1】:

当用户向下滚动时,计算机检查滚动量。假设您向下滚动 50 像素。计算机检查滚动距离是否等于或大于 50。 如果是这样,那么它将显示新的你没有注册?! 然后如果滚动距离小于 50,则顶部按钮将不再显示。

【讨论】:

  • 您好,我在您的帮助下成功了。我使用 javascript 检查滚动高度并在 css 的帮助下更改
    文本
【解决方案2】:

不,这是简单的 HTML,或者更确切地说是 CSS。使用position: fixed;。见-here。例如,您也可以查看my site

【讨论】:

  • 实际上 9gag.com 上的效果是用 javascript 实现的,它不仅仅是 postion:fixed,因为它从页面开始向下一点,检测到任何滚动,然后重新定位按钮。跨度>
  • @Crisman 是的,但是在它卡入标题之前需要这样做。要在那里维护它,可以使用position: fixed
  • 大家好,我设法解决了,我同时使用了 css 和 javascript。
【解决方案3】:

这是一个几乎重复的问题:How does economist.com implement their sticky header? jQuery?

答案是你用javascript检测滚动,把你要移动的div的css改成position:fixed,经过一定量的滚动。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2011-06-20
    • 1970-01-01
    • 2011-05-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-06-07
    相关资源
    最近更新 更多