как сделать чтобы квадратики меняли цвет с 1) белого 2) красного 3) синего 4) черного
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo by holden321</title>
<style type="text/css">
div {
border: 0px solid black;
width:50px;
height:50px;
float:left;
margin: auto;
text-align: center;
}
#log {text-align:right;}
</style>
<script type="text/javascript">
function zapusk(d) {
if (!d.rgb)
{
d.rgb = 0;
}
s = (d.rgb).toString(16);
while (s.length < 3)
{
s = '0' + s;
}
s = '#' + s;
d.style.backgroundColor = s;
//document.getElementById("log").innerHTML=s;
d.rgb+= 1;
if (d.rgb > 0xfff)
d.rgb = 0;
}
window.onload=function(){
setInterval(function(){zapusk(document.getElementById('cvet1'))}, 100);
setInterval(function(){zapusk(document.getElementById('cvet2'))}, 200);
setInterval(function(){zapusk(document.getElementById('cvet3'))}, 300);
setInterval(function(){zapusk(document.getElementById('cvet4'))}, 400);
}
</script>
</head>
<body>
<div style="width:100px; height:100px; border:0px">
<div id="cvet1"></div>
<div id="cvet2"></div>
<div id="cvet3"></div>
<div id="cvet4"></div>
</div>
<div id="log">#00131e</div>
</body></html>
|
например так
var color = ['grey','red','blue','black'];
setInterval(function(){
$.each($('div'),function(){
var c = $(this).data('color');
if (c+1>3) {
$(this).data('color',0)
$(this).css('background',color[0])
}
else {
$(this).data('color',c+1)
$(this).css('background',color[c+1])
}
})
},2000)
<div data-color="0">1</div> <div data-color="1">2</div> <divdata-color="2">3</div> <div data-color="3">4</div> |
| Часовой пояс GMT +3, время: 05:11. |