文字の色を虹色に変化させるスクリプト
文字の色を虹色に変化させるスクリプトを書いてみた。またくだらないものを書いてしまった。
function getColor (n) { const M = 255; let c = n % 360 / 60 | 0; let x = n % 60 / 60 * M |0; let y = M - x; let [r,g,b]=[[M,0,y],[M,x,0],[y,M,0],[0,M,x],[0,y,M],[x,0,M]][c]; return 'rgb(' + r + ',' + g + ',' + b +')'; } { let e = document.querySelector('#hoge'); let c = e.textContent.split(''); e.innerText = null; c.forEach (c=>e.appendChild(document.createElement('span')).textContent=c); let ss = [...document.querySelectorAll ('span')]; let col = 0; function loop () { for (let i = 0; i < ss.length; i += 1) { ss[i].style.color = getColor (col + i*2); } col = (col + 1) % 360; } setInterval (loop, 10);
}
Test