JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<div id="parallax"></div>

CSS

#parallax {
  margin: 1000px 0;
  width: 100%;
  height: 490px;
  border: 5px solid #000;
  background: url(http://victorpavloff.tmweb.ru/abc/real_scenery.jpg) 50% 0px no-repeat fixed;
}

JavaScript

$window = $(window);
	
	var BlockTop = $('#parallax').offset().top;
    $window.on('load scroll', function() {
        var Top = $window.scrollTop();
        var Height = $window.height();
		var Scroll = BlockTop-Top-Height;
        if (Top + Height >= BlockTop) {
            $('#scroll').text(Scroll);
			Parallax();
        }
    });
	
	function Parallax() {
		$('#parallax').each(function(){
            var $bgobj = $(this);
			var Top = $window.scrollTop();
			var Height = $window.height();
			var Scroll = BlockTop-Top;
            $window.on('load scroll', function() {
                var yPos = Scroll/5;
				var coords = '50% '+ yPos + 'px';
				$bgobj.css({ backgroundPosition: coords });
			});
		});
	}