lt; html> lt; head> lt; meta http-equiv ="Content-Type" content ="text / html; charset = UTF-8">
lt; title> подорож у временіlt; / title>
lt; style type ="text / css">
div {
border: 0px solid black;
width: 50px;
height: 50px;
float: left;
margin: auto;
text-align: center;
}
log {text-align: right;}
lt; / style>
lt; script type ="text / javascript">
function init (d, r, g, b, r1, g1, b1)
{
d.colors = new Array ();
d.colors.push (r);
d.colors.push (g);
d.colors.push (b);
d.colors.push (r1);
d.colors.push (g1);
d.colors.push (b1);
}
function zapusk (d)
{
s = '#';
for (var i = 0; i lt; 3; i ++)
{
d.colors [i] + = d.colors [i + 3];
if (d.colors [i] lt; 0)
{
d.colors [i] = 0;
d.colors [i + 3] = -d.colors [i + 3];
}
if (d.colors [i]> 0xff)
{
d.colors [i] = 0xff;
d.colors [i + 3] = -d.colors [i + 3];
}
s1 = Math.floor (d.colors [i]). toString (16);
while (s1.length lt; 2)
{
s1 = '0' + s1;
}
s + = s1;
}
d.style.backgroundColor = s;
}
window.onload = function () {
init (document.getElementById ( 'cvet1'), 255, 0, 0, 1, 1, 1);
init (document.getElementById ( 'cvet2'), 0, 0, 255, 1, 1, 1);
init (document.getElementById ( 'cvet3'), 0, 255, 0, 1, 1, 1);
init (document.getElementById ( 'cvet4'), 255, 0, 255, 1, 1, 1);
setInterval (function () {zapusk (document.getElementById ( 'cvet1'))}, 1);
setInterval (function () {zapusk (document.getElementById ( 'cvet2'))}, 5);
setInterval (function () {zapusk (document.getElementById ( 'cvet3'))}, 10);
setInterval (function () {zapusk (document.getElementById ( 'cvet4'))}, 20);
}
lt; / script>
lt; / head>
lt; body>
lt; div style ="width: 100px; height: 100px; border: 0px">
lt; div id ="cvet1"style ="background-color: rgb (0, 0, 0);"> Lt; / div>
lt; div id ="cvet2"style ="background-color: rgb (0, 0, 0);"> Lt; / div>
lt; div id ="cvet3"style ="background-color: rgb (0, 0, 0);"> Lt; / div>
lt; div id ="cvet4"style ="background-color: rgb (0, 0, 0);"> Lt; / div>
lt; / div>
lt; div id ="log"> #fffffflt; / Div>
lt; / body> lt; / html>
Залишити відповідь