Shopify Liquid - This snippet provides a sticky header for your theme, utilizing jQuery.

stickyHeader.liquid

<!-- HTML CODE -->
{%include 'header' %}
 <div class="header__wrapper__extra">
	{%include 'header' %}
</div>


<!-- SCSS -->
<style>
	/* ===========================================
		HEADER
	=========================================== */
	.site-header {
		border-bottom-color: #e4e4e4;
	}
	.header__wrapper__extra {
		display: block;
		z-index: 10000;
		width: 100%;
		position: fixed;
		top: -25%;
		left: 0;
		transition: top .5s;
	}
	.fixed__header {
		top: 0;
	}
</style>


<!-- JS CODE -->
<script>
	// STICKY FIXED HEADER
	$(document).ready(function(){
	  
	  var headerN = $('.header__wrapper__extra'),
	      headerH = headerN.height();

	  function checkHeaderFixed(){
	    var fromTop = $(document).scrollTop();
	    if( fromTop > (headerH + 50)){
	      headerN.addClass('fixed__header');
	    } else {
	      headerN.removeClass('fixed__header');
	    }
	  }
	  
	  checkHeaderFixed();
	  
	  if( $(window).width() > 768 ){
	    $(document).scroll(function(){
	      checkHeaderFixed();
	    });
	  } else {
	    $('.header__wrapper__extra').removeClass('fixed__header');
	  }
	  
	});
</script>