Показать сообщение отдельно
  #2 (permalink)  
Старый 15.10.2013, 20:54
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

eko24,
белый верх, чёрный низ есть? есть!!!
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
span {padding-left:50px; width: 50px; height: 50px;}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function() {
function simulation(id, e) {
    var d = $("#" + id),
         c = 0,
         n = 0;
        (function (a, b) {
                return function () {if (!n){
                a.css({"background-color": b[c].color});//меняем фон
                n = b[c].time;
                c = ++c % b.length
                };
                a.html(n); //показываем длительность текущего цвета
                n--;
                window.setTimeout(arguments.callee, 1000);
            }
        })(d, e)()
    }
simulation("c0",[{color:'red' ,time:12 },{color:'green' ,time:8 },{color:'red' ,time:6 },{color:'yellow' ,time:4 },{color:'red' ,time:4 },{color:'yellow' ,time:5 }]);
simulation("c1",[{color:'red' ,time:3 },{color:'green' ,time:3 },{color:'red' ,time:3 },{color:'yellow' ,time:3 },{color:'red' ,time:3 },{color:'yellow' ,time:15 }]);
})

</script>
</head>
<body>
<span id="c0"></span><br>
<span id="c1"></span>
</body>
</html>
Ответить с цитированием