JSFiddle - React, Tailwind, and code Playground

by Tyler N.

JavaScript

var $body = $('body');
var $header = $('header');
var fbsPosition = $( '.featured-brands-slide' ).position().top;
var wSt = $(window).scrollTop();

function minimizeHeader() {
	var triggerScroll;
	var scrollPoint;

	if ($body.hasClass( 'home' )) {
		triggerScroll = wSt - fbsPosition
		scrollPoint = -400;
	} else {
		triggerScroll = 200;
		scrollPoint = 200;
	}

	if (triggerScroll >= scrollPoint) {
		$header.addClass( 'minimized' );
	} else {
		$header.removeClass( 'minimized' );
	}
}

$(window).scroll(function() {
	minimizeHeader();
});