Как изменить цвет меню бургера в зависимости от фона?

Question

На странице у меня много разделов:

<section class="white"></section>
<section class="blue-gradient"></section>
<section class="white"></section>
<section class="blue-gradient"></section>
...

И я исправил меню бургера. Мне нужно изменить цвет бургера в зависимости от фона раздела, когда мы прокручиваем. Когда гамбургер на белом участке - гамбургер синего цвета, когда гамбургер на синем участке - гамбургер белого цвета.

Answer 1

Вы можете посмотреть, какая секция в данный момент видна, и соответственно переключить меню бургера:

https://jsfiddle.net/3urpd60s/

$(document).on("scroll",function(){

    var scrollTop = $(document).scrollTop(), 
        elems = $("section"),
        sections = elems.map((i,n)=> $(n).height()),
        tmp = -1, i = 0;

        while(tmp < scrollTop){
           tmp += sections[++i];
        }

    $('#burger').toggleClass("white", !$(elems[--i]).hasClass("white"));    

});