Navbar changing colour on scroll, how does this jQuery work? -

so i've copied code question here navbar changes color on scroll. it:

$(document).ready(function(){         var scroll_start = 0;  var startchange = $('#startchange');  var offset = startchange.offset();   if (startchange.length){ $(document).scroll(function() {     scroll_start = $(this).scrolltop();    if(scroll_start > offset.top) {        $(".navbar-default").css('background-color', '#f0f0f0');     } else {        $('.navbar-default').css('background-color', 'transparent');     } });  } 

});

it's working , (with necessary id/classes changed ofcourse), want know how works since have no idea. understand code saying change colour of navbar once top of screen scroll past top of #startchange. that's really, im not sure offsets , scrtolltop doing. obviously, im new js/jquery. in advance.

in summary offset() , scrolltop() jquery functions. jquery library of javascript functions. js language browser interpret.

let me give real definitions:

offset(): current coordinates of first element in set of matched elements, relative document.

srolltop(): current vertical position of scroll bar first element in set of matched elements or set vertical position of scroll bar every matched element.

your code execute function when document ready.

$(document).ready(function(){ 

it supported 3 variables (var).

 var scroll_start = 0;  var startchange = $('#startchange');  var offset = startchange.offset(); 

and when event 'scroll' of document detected code calls function change css properties element class 'navbar-default'. when condition satisfied , have scrolled higher value offset of element id 'startchange' (#startchange)

$(document).scroll(function() {     scroll_start = $(this).scrolltop();    if(scroll_start > offset.top) {        $(".navbar-default").css('background-color', '#f0f0f0');     } else {        $('.navbar-default').css('background-color', 'transparent');     } }); 

here jquery documentation can consult each of functions

happy learning. happy coding. feel free ask need.