<div class="obj scroll-fadein"></div>

.scroll-fadein {
		opacity: 0;
}
.anime {
	animation-play-state: paused;
	&.active {
		animation-play-state: running !important;
		opacity: 1;
	}
	&.scroll-fadein {
		animation: opacity 0.8s forwards linear;
		animation-play-state: paused;
	}
}

$(window).on('scroll', function () {

    let elem = $('.obj')
    let isAnimate = 'active anime'
    elem.each(function () {
        let elemOffset = $(this).offset().top
        let scrollPos = $(window).scrollTop()
        let wh = $(window).height()
        const start = elemOffset - wh + (wh / 5)
        const end = elemOffset + wh
        if (scrollPos > start && scrollPos < end) {
            $(this).addClass(isAnimate)
        }
        else if ((scrollPos < start + wh || scrollPos > end + wh)) {
            $(this).removeClass(isAnimate)
        }
    })
})