I know html, css and sensitive js, where would I find the answer to my question? I don't know js well enough to solve a problem with it. Maybe there are other solutions?

Closed due to the fact that it is necessary to reformulate the question so that it is possible to give an objectively correct answer to the participant Nicolas Chabanovsky 16 Apr '16 at 7:14 .

The question gives rise to endless debates and discussions based not on knowledge, but on opinions. To get an answer, rephrase your question so that it can be given an unambiguously correct answer, or delete the question altogether. If the question can be reformulated according to the rules set out in the certificate , edit it .

    2 answers 2

    This can be done using the jQuery library. In general, I advise you to study JavaScript better.

    Here is the simplest example: https://jsfiddle.net/ep6wrvrk/3/

    $(document).ready(function(){ $(document).scroll(function(){ var step = $(document).scrollTop() / (document.body.clientHeight - window.innerHeight); $("#sidebar").css( "background-color", "rgb(" + Math.round(step*255) + ", 0, 0)" ); }); }); 

    A scrolling event tracking is created on the document, then when scrolling we get the distance factor from the beginning of the document to the beginning of the window and already manipulate this value. In this case, multiply by max. rgb value and put it on the red channel, then use it as the background color of the div.

      This is too unusual an operation to be present in any library "out of the box." At the same time, the implementation on js is extremely simple - hang the event for scrolling and recalculate the color of the div.

      Perhaps this can really be solved with the help of css, but I doubt that the solution will be cross-browser.