Cacher is the code snippet organizer for pro developers

// updated to check for window resize and update margin dynamically
// reduce menu on scroll down
jQuery(document).ready(function($) {

	$(window).load(function() { 
		// cache dom
		var $window = $(window);
		$header = $(".header");

		function checkWidth() {
			// cache dom
			var $windowsize = $window.width();
			var $headHeight = $header.height();
			var $wrapper 	= $('.wrapper');
			var $userTab	= $('#user').height();
			// resize top margin of header based on header height (minus user tab)
			// to clear fixed position menu content
			if ($windowsize > 991 ) {
				// $wrapper.css({'margin-top': $headHeight - $userTab + 10});
				$wrapper.css({'margin-top': $headHeight});
				console.log($headHeight);
			}

			// recalculate depending on window width
			else {
				$wrapper.css({'margin-top': $headHeight});
			}
		}
    
    // run function on page load
		checkWidth();
		
    //bind event listener to check on window resize
		$(window).resize(checkWidth);

		// detect scroll down and reduce menu size / style
		$(document).on("scroll", function() {
			if ($(document).scrollTop()>20) {
				$header.removeClass("large").addClass("small");
			} else {
				$header.removeClass("small").addClass("large");
			}
		});
	});
});

// reduce menu on scroll down
jQuery(document).ready(function($) {
	
	$(document).on("scroll", function() {

		$header = $(".header");

		if ($(document).scrollTop()>100) {
			$header.removeClass("large").addClass("small");
		} else {
			$header.removeClass("small").addClass("large");
		}
	
	});
});

// update header size and margin based on load size
$(function() {
    var headHeight = $('header').outerHeight();

    $('.welcome-home').css({'margin-top': headHeight });
});