Div将页面滚动到固定位置

时间:2011-08-05 06:43:27

标签: jquery css html

即使使用了萤火虫,我也无法想象如何实现这一点:

查看页面左侧的社交div。它顺利地跟着你:他们使用哪种css定位?我只是读了一个绝对的位置,仅此而已。

  1. 我尝试了同样但它不会在我的页面中滚动
  2. 使用jquery和animate使它太漂亮了
  3. 在每个卷轴上调整css看起来很奇怪,它停留了一毫秒然后移动 如何获得同样的效果?
  4. http://techcrunch.com/2011/08/04/sources-livingsocial-close-to-acquiring-turkish-daily-deals-site-grupfoni/

3 个答案:

答案 0 :(得分:6)

这是一个jquery插件的演示,负责处理这个问题。这个插件的根源在于Joe上面提到的优秀教程,但它使教程中提供的解决方案更进一步。

演示:http://jsfiddle.net/y3qV5/

插件和来源:https://github.com/bigspotteddog/ScrollToFixed

用法:

$(document).ready(function() {
    $('#cart').scrollToFixed();
});

答案 1 :(得分:2)

使用一些jQuery和CSS尝试此解决方案。它可以给你带来相同的效果而且工作量相当少......

http://jqueryfordesigners.com/fixed-floating-elements/

答案 2 :(得分:0)

这种效果有两种相关的风格:

.post-share-widget.floating {
    position: fixed;
    top: 68px;
}
.post-share-widget.pinnedTop {
    bottom: auto;
    position: absolute;
}

他们使用javascript滚动处理程序将widget容器上的className设置为“floating”或“pinnedTop”,具体取决于页面的当前滚动位置。