スクロールバーの色の変更

Question

スクロール時にバーの色を変更する必要があります：ページを読み込むときにバーを緑色で塗りつぶし、スクロールするときは塗りつぶし赤の色

これはネイティブのJavaScriptで簡単に行うことができますか？

Answer 1

は、[OK]を、この

var scrollTimeout; 
window.onscroll = function() { 
    clearTimeout(scrollTimeout); 
    svg.selectAll(".bar").style('fill', 'red'); 
    scrollTimeout = setTimeout(function() { 
     svg.selectAll(".bar").style('fill', 'steelblue'); 
    }, 500); 
} 

を試してみてください。したがって、色を動的に変更するには、HSL colorを使用して最初の値を変更します。私は赤から緑まで0-125の期間を使います。

var scrollHeight = document.body.scrollHeight - window.innerHeight; 
window.onscroll = function() { 
    var color = 125 - 125/scrollHeight * window.pageYOffset; 
    svg.selectAll(".bar").style('fill', function(){return 'hsl('+color+', 100%, 50%)'}); 
} 

また、uは調子の色の色相に必要がある場合は、ちょうど最後の二つのパラメータ