Change Header Background Color on Scroll in Elementor FREE!

    

<style>
  #mainheader.change-color{
      background-color: blue;
  }
</style>
<script>

jQuery(document).ready(function($){
   $(window).scroll(function(){
      if($(this).scrollTop() > 50){
          $("#mainheader").addClass("change-color");
      } 
      else{
          $("#mainheader").removeClass("change-color");
      } 
   });
    
});
</script>