Скролл баннера в заданном диапазоне
 

Друзья, нужен "плавающий" баннер в пределах диапазона и с отступом сверху .
Высчитываю точку, с которой должен баннер "плыть" вниз. Потом есть точка, до которой он "плывёт". Сверху вниз плывёт как-то рывками. А снизу вверх начинает "плыть", когда поднимается до точки старта "плавания". Плюс еще "плывёт" рывками. Три дня уже гуглю, и что-то туплю. Нужен свежий взгляд и хороший совет.

<div class="banner2">
<img src="https://www.cyberforum.ru/images/banner2.png" alt="banner2">
</div>

/* CSS*/
/* позиция баннера до старта скролла */
.banner2 {  
    position: relative;;
    top: 20px;
    right: 0;
}
/* позиция баннера во время скролла */
.banner_fix_top {
    position: fixed;
    top: 20px;
    right: 0;
}
/* позиция баннера после скролла */
.banner_fix_bottom {
    position: relative;
    top: 370px;
    right: 0;
}

// jquery
var block_height = $('.block_banner').offset(); // точка старта
var block_footer = $('.social-icon').offset();  // точка финиша
$(document).scroll(function () {
    if ($(this).scrollTop() > block_height.top && $(this).scrollTop() < block_footer.top) {  //диапазон скролла
        $('.banner2').addClass('banner_fix_top');
    } else {
        $('.banner2').removeClass('banner_fix_top');
    }
    if ($(this).scrollTop() > block_height.top) {  //старт скролла
        $('.banner2').addClass('banner_fix_top');
    }
 
    
    if ($(this).scrollTop() > block_footer.top - 750) { // финиш скролла
        $('.banner2').addClass('banner_fix_bottom');
        $('.banner2').removeClass('banner_fix_top');
    }
 
    if ($(this).scrollTop() < block_height.top) { // до начала скролла 
        $('.banner2').removeClass('banner_fix_top');
        $('.banner2').removeClass('banner_fix_bottom')
    }
});

Подсказали на другом форуме, вдруг кому-то пригодится:

$(document).scroll(function () {
    // если в диапазоне то класс 'banner_fix_top'
    if ($(this).scrollTop() > block_height.top && $(this).scrollTop() < block_footer.top - 600) 
    {
        $('.banner2').addClass('banner_fix_top');
        $('.banner2').removeClass('banner_fix_bottom');
    // выходит за пределы диапазона вниз меняем класс на 'banner_fix_bottom'
    } else if ($(this).scrollTop() > block_footer.top - 600) 
    { 
        $('.banner2').addClass('banner_fix_bottom');
        $('.banner2').removeClass('banner_fix_top');
    } // выходит за пределы диапазона вверх удаляем классы
    else if ($(this).scrollTop() < block_height.top)
    {
        $('.banner2').removeClass('banner_fix_top');
        $('.banner2').removeClass('banner_fix_bottom');
    }
      
});