How to make the values change after 1 second o=by+2 m=by+3 and the dependence on formulas that change color remains?

A
allcoma2014-10-04 11:10:10
JavaScript
allcoma, 2014-10-04 11:10:10
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

    <title>Document</title>
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="http://boedesign.com/demos/gritter/js/jquery.gritter.js"></script><!-- тырим  плагин -->
    <link rel="stylesheet" type="text/css" href="http://boedesign.com/demos/gritter/css/jquery.gritter.css" />


    <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);
}
interval = []
once= true
function zapusk(d) {
  s = '#';
  for (var i = 0; i < 3; i++) {
    d.colors[i] += d.colors[i + 3];
    if (d.colors[i] < 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 < 2) {
      s1 = '0' + s1;
    }
    s += s1;
  }
  d.style.backgroundColor = s;
}
 function start() {
  var h = $('#i0').val()||10; // шаг цвета
  var o = parseInt($('#i1').val())||1111; // число скачков
  var m = parseInt($('#i2').val())||12345; // пройденное время в секундах 
  var a = parseInt($('#i3').val())||9999999999; // пройденное время в секундах максимальное
  var b = parseInt($('#i4').val())||0.001; // 1 цвет в столько секундах
  var c = parseInt($('#i5').val())||a / b; // такой цвет через пройденное время
  var t = parseInt($('#i6').val())||255; // диапазон количество цветов
  var k = parseInt($('#i7').val())||1; // время изменения цвета
  var l = parseInt($('#i8').val())||0; // номер цвета
  
  $('#i0').val(h)
  $('#i1').val(o)
  $('#i2').val(m)
  $('#i3').val(a)
  $('#i4').val(b)
  $('#i5').val(c)
  $('#i6').val(t)
  $('#i7').val(k)
  $('#i8').val(l)
  
  
  var f = Math.floor(c);
  var u = c / t;
  var q = Math.floor(u);
  var z = t * q;
  var x = f - z;
  var e = Math.floor(c) - t * (Math.floor((c) / t)); // перевод такого цвета через пройденное время в заданный диапазон цветов
  var v = Math.floor(a / b) - t * (Math.floor((a / b) / t)); // перевод такого цвета через пройденное время в заданный диапазон цветов
  var p = (((Math.floor(a / b) - t * (Math.floor((a / b) / t))) * o) + (Math.floor(m / b) - t * (Math.floor((m / b) / t)))); // скачки во времени
  var r = Math.floor((((Math.floor(a / b) - t * (Math.floor((a / b) / t))) * o) + (Math.floor(m / b) - t * (Math.floor((m / b) / t))))) - t * (Math.floor(((((Math.floor(a / b) - t * (Math.floor((a / b) / t))) * o) + (Math.floor(m / b) - t * (Math.floor((m / b) / t))))) / t)); // скачки во времени в заданный диапазон цветов
  var s = (((Math.ceil(r * 2)) * 255)) - 255; // скачек в черно белое 0 и 255init(document.getElementById('cvet1'), r, 1, 1, 1, 1, 1); // цвет
  var n=(((Math.ceil(Math.random() *2))*255))-255; // черно белое 0 и 255 случайно
  
  
  
init($(".quard")[0], l, l, Math.floor(a/(b+0.000))-t*(Math.floor((a/(b+0.000))/t)), 1, 1, h);
init($(".quard")[1], l, l, Math.floor(a/(b+0.001))-t*(Math.floor((a/(b+0.001))/t)), 1, 1, h);
init($(".quard")[2], l, l, Math.floor(a/(b+0.002))-t*(Math.floor((a/(b+0.002))/t)), 1, 1, h);
init($(".quard")[3], l, l, Math.floor(a/(b+0.003))-t*(Math.floor((a/(b+0.003))/t)), 1, 1, h);
init($(".quard")[4], l, l, Math.floor(a/(b+0.004))-t*(Math.floor((a/(b+0.004))/t)), 1, 1, h);
init($(".quard")[5], l, l, Math.floor(a/(b+0.005))-t*(Math.floor((a/(b+0.005))/t)), 1, 1, h);
init($(".quard")[6], l, l, Math.floor(a/(b+0.006))-t*(Math.floor((a/(b+0.006))/t)), 1, 1, h);
init($(".quard")[7], l, l, Math.floor(a/(b+0.007))-t*(Math.floor((a/(b+0.007))/t)), 1, 1, h);
init($(".quard")[8], l, l, Math.floor(a/(b+0.008))-t*(Math.floor((a/(b+0.008))/t)), 1, 1, h);



  interval.push(setInterval(function() { zapusk($(".quard")[0]) }, k+1));
interval.push(setInterval(function() { zapusk($(".quard")[1]) }, k+2));
interval.push(setInterval(function() { zapusk($(".quard")[2]) }, k+3));
interval.push(setInterval(function() { zapusk($(".quard")[3]) }, k+4));
interval.push(setInterval(function() { zapusk($(".quard")[4]) }, k+5));
interval.push(setInterval(function() { zapusk($(".quard")[5]) }, k+6));
interval.push(setInterval(function() { zapusk($(".quard")[6]) }, k+7));
interval.push(setInterval(function() { zapusk($(".quard")[7]) }, k+8));
interval.push(setInterval(function() { zapusk($(".quard")[8]) }, k+9));


}
window.onload =  function(){
  
  $(document).on( "click","#start",  function(event){

for (var i = 0; i < interval.length; i++) { //останавливаем   предыдушее
  clearInterval(interval[i]);
};
start()// стартуем новый  цикл  с введенными значениями 
if(once){
$.gritter.add({
  // (string | mandatory) the heading of the notification
  title: 'вопрос ',
  // (string | mandatory) the text inside the notification
  text: ' Если картина имеет ширину и длину то можно получить из красок все варианты изображений и это число не бесконечно как длинна ширина и количество цветов, если в картине перемешать цвета то можно получить другую картину, и можно ли получить перемешиванием цветов картину будущего или прошлого и будет ли эта схем перемешивания машиной времени?'})
once = false;
}
event.preventDefault();	
  })//on
}//  onload
</script>
    <style>
    #cell{width:302px;
    height:302px;
    border:1px solid  rgb(00,00,00);}
    .quard{
      width: 100px;
      height: 100px;
      float: left;
    }
    </style>
    <script>
    </script>
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="col-md-6">
          <form action="" role="form">
            
            <div class="form-group"><label for="i0">шаг цвета</label><input type="text" class="form-control" placeholder="шаг цвета" id="i0"></div>
            <div class="form-group"><label for="i1">число скачков</label><input type="text" class="form-control" placeholder="число скачков" id="i1"></div>
            <div class="form-group"><label for="i2">пройденное время в секундах </label><input type="text" class="form-control" placeholder="пройденное время в секундах " id="i2"></div>
            <div class="form-group"><label for="i3">пройденное время в секундах максимальное</label><input type="text" class="form-control" placeholder="пройденное время в секундах максимальное" id="i3"></div>
            <div class="form-group"><label for="i4">цвет в столько секундах</label><input type="text" class="form-control" placeholder="цвет в столько секундах" id="i4"></div>
            <div class="form-group"><label for="i5">такой цвет через пройденное время</label><input type="text" class="form-control" placeholder="такой цвет через пройденное время" id="i5"></div>
            <div class="form-group"><label for="i6">диапазон количество цветов</label><input type="text" class="form-control" placeholder="диапазон количество цветов" id="i6"></div>
            <div class="form-group"><label for="i7">время изменения цвета</label><input type="text" class="form-control" placeholder="время изменения цвета" id="i7"></div>
            <div class="form-group"><label for="i8">номер цвета</label><input type="text" class="form-control" placeholder="номер цвета" id="i8"></div>
            <div class="form-group"><label for=""></label><button class="btn btn-danger" id="start">поехали</button></div>
          </form>
        </div>
        <div class="col-md-6"><div class="center-block" id="cell">

<div class="quard" style="background-color: rgb(0, 0, 1);"></div>
<div class="quard" style="background-color: rgb(0, 0, 2);"></div>
<div class="quard" style="background-color: rgb(0, 0, 3);"></div>
<div class="quard" style="background-color: rgb(0, 0, 4);"></div>
<div class="quard" style="background-color: rgb(0, 0, 5);"></div>
<div class="quard" style="background-color: rgb(0, 0, 6);"></div>
<div class="quard" style="background-color: rgb(0, 0, 7);"></div>
<div class="quard" style="background-color: rgb(0, 0, 8);"></div>
<div class="quard" style="background-color: rgb(0, 0, 9);"></div>




            
          </div></div></div>
        </div>
      </div>
    </body>
  </html>
Reply
Answer the question
In order to leave comments, you need to log in
2 answer(s)
A
asdz, 2014-10-04
@asdz
And you throw it on jsfiddle.net, otherwise it’s not clear what it is.
A
allcoma, 2014-10-04
@allcoma
jsfiddle.net/allcoma/9tc2Lhf5