在具有固定高度和溢出量的div内使用时,JQuery Offset出现问题。

在这个div中,我有两列,一个主栏和一个侧栏。我希望侧边栏中的一个div在div中滚动直到到达顶部,但是然后我希望它停留在该位置。

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

div确实会向上滚动,但直到滚动到div的顶部之前,它才开始停留在顶部,从而有效地切断了div的顶部。

任何帮助将不胜感激。

最佳答案

您需要顶部偏移量,其中<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
                });
            }
        });
    }
})

09-10 07:27
查看更多