[rafaello]

Вроде все сделал.
Остался один момент, прошу помощи.
У меня главная страница - лендинг, длинная колбаса.
И нужный блок расположен на 4 месте.
Мне надо отследить момент попадания заданного блока в зону видимости окна браузера и подключить аннимацию для изменения opacity background-image.
То, что нашел в интернете решения работают, но не так как надо.

jQuery(document).ready(function(){
var fadeStart=1300 //  scroll or less will equiv to 1 opacity
    ,fadeUntil=1940 // scroll or more will equiv to 0 opacity
    ,fading = jQuery('#new-it4738g6');
jQuery(window).scroll(function(){
    var offset = jQuery(document).scrollTop(),opacity=0;
    if( offset<=fadeStart ){
        opacity=1;
    }else if( offset<=fadeUntil ){
        opacity=1-offset/fadeUntil;
    }
    fading.css('opacity',opacity);//.html(opacity);
});
});
jQuery(document).ready(function(){
var target = jQuery('#new-it4738g6');
var targetHeight = target.outerHeight();
jQuery(document).scroll(function(e){
    var scrollPercent = (targetHeight - window.scrollY) / targetHeight;
    if(scrollPercent >= 0){
        target.css('opacity', scrollPercent);
    }
});
});
jQuery(document).ready(function(){
jQuery(window).scroll(function(){
                jQuery('#new-it4738g6').css("opacity", 1- jQuery(window).scrollTop() / 700)
            })
});

все эти три решение работают не так как надо.
Вот здесь нашел вроде нужную информацию
https://snipp.ru/jquery/show-on-scroll

Еще раз.
Помогите составить код так, чтобы прозрачность начала меняться когда только блок попадет в зону видимости окна браузера и полностью будет прозрачно, когда блок занял уже 80-90% по высоте зону видимости в окне браузера.
Заранее спасибо!