溢出Div中的偏移问题

时间:2011-08-04 20:28:36

标签: jquery css html offset

我在使用具有固定高度和溢出的div内部时遇到JQuery Offset问题。

在这个div里面我有两列,一个是主栏和一个侧栏。我希望侧栏中的一个div在div内滚动直到它到达顶部,但我希望它留在那里。

我在这里设置了一个演示:http://jsfiddle.net/zsJAr/53/

div会向上滚动,但它不会开始保持在顶部,直到它滚过div的顶部,有效地切掉div的顶部。

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:1)

您需要<h1>所在的顶部偏移:

http://jsfiddle.net/maniator/qaVnY/

$(document).ready(function() {

    // move the share this widget with the window
    if ($('#scrollingContent').length > 0) {
        var $widget = $("#scrollingContent");
        var $window = $("#overFlowDiv");
        var $topOffset = $('h1').height();
        var $offset = $widget.offset();
        var $initialMargin = $widget.css('marginTop');

        $window.scroll(function() {
            if ($window.scrollTop() > ($offset.top)) {
                $widget.stop().animate({
                    marginTop: ($window.scrollTop() - ($offset.top - $topOffset))
                });
            } else {
                $widget.stop().animate({
                    marginTop: $initialMargin
                });
            }
        });
    }
})

答案 1 :(得分:1)

有点不那么传统,但这似乎对我有用......

$window.scroll(function() {
if ($window.scrollTop() > $offset.top) {
$widget.stop().animate({
  marginTop: ($window.scrollTop() -(180 - $offset.top))
});