Проблемы со смещением в переполнении Div

Question

У меня проблемы с JQuery Offset при использовании внутри div, который имеет фиксированную высоту и переполнение.

Внутри этого div у меня есть два столбца, основной и боковой панели.Я хочу, чтобы один из элементов div в боковой панели прокручивался внутри элемента div, пока он не достигнет вершины, но затем я хочу, чтобы он оставался там.

У меня здесь настроено демо: http://jsfiddle.net/zsJAr/53/

Блок прокручивается вверх, но он не начинает оставаться наверху, пока не прокручивается мимо вершины блока, что эффективно отсекает верхнюю часть блока.

Любая помощь будет в значительной степениоценили.

Answer 1

Немного менее условно, но мне показалось, что это работает ...

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

Answer 2

Вы нуждались в верхнем смещении, где <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
                });
            }
        });
    }
})