Прилипший блок, который следует за экраном с помощью jQuery

Я уже давно стал замечать на многих блогах и сайтах небольшие блоки с социальными кнопками, которые забавно так передвигаются за экраном. Прокручиваешь, прокручиваешь, а этот блок с небольшим опозданием следует за вами.
По мне, так это круто просто. Самое главное, сделать этот блок не назойливым, а удобным. Лично для меня, очень удобно, когда я могу поделиться найденной информацией, к примеру, со своими читателями в Twitter`е.
Такая реализация, как нельзя лучше, для этого подходит.
Вот пример, для того, чтобы было понятно о чем я тут пишу.
Пример прилипшего блока
Для особо любознательных можно посмотреть исходный код страницы с примером, ну а для ленивых приведу используемый JS-код здесь:
<script>
// Float Social block
$(document).ready(function() {
var fixed = $("#social");
var offset = fixed.offset();
var topPadding = 40;
$(window).scroll(function() {
if ($(window).scrollTop() > offset.top) {
fixed.stop().animate({marginTop: $(window).scrollTop() - offset.top + topPadding});
} else {
fixed.stop().animate({marginTop: 0});
};
});
});
</script>
В CSS необходимо добавить блоку #social свойство position: absolute. Это важно! Иначе работать просто не будет.
Интересная статья, просто и доступно написано, как добавить прилипший блок, который иногда необходим, в рекламе или чтобы поделиться страницей или статьей в других социальных сетях.
Возникла с этим скриптом проблема – при изменении Наполнения страницы с помощью того же JQ (например сворачивание\разворачивание элементов), скользящий блок начинает отставать или опережать экран на высоту, занятую развернутым элементом.
Как можно решить проблему?