Hello everyone,
So my question is the following :
My personnal website is divided into sections that are colored with
different contrasts, so as I scroll past a certain section, I need my
fixed menu to change its color css property.
At first I tried to use boundingClientRect.top this way :
-
- $(function(){
-
- var
projetTop = $("#projects")[0].getBoundingClientRect().top;
-
- var
menuTop = $("nav")[0].getBoundingClientRect().top;
-
- $(window).scroll(function(){
-
- var
calc = projetTop-menuTop;
-
- if(calc<0){
-
- $("nav a").css("color","#F6F2ED");
-
- }
- else{
-
- $("nav a").css("color","#696765");
-
- }
- });
-
- });
But it doesn't seem to work really well...
Actually, the section I'm talking about is one of the last sections
on the site, and the color changing happens immediately after I start
scrolling first.
Do you guys have any solutions for this problem ?
thank you very much for your future answers, and pardon my english,
I'm from France ^^