Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta 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 n = $('#i0').val()||(((Math.ceil(Math.random() * 2)) * 255)) - 255; // черно белое 0 и 255 случайно
- var o = parseInt($('#i1').val())||1111; // число скачков
- var m = parseInt($('#i2').val())||12345; // пройденное время в секундах
- var a = parseInt($('#i3').val())||999999999999999; // пройденное время в секундах максимальное
- var b = parseInt($('#i4').val())||0.001; // 1 цвет в столько секундах
- var c = parseInt($('#i5').val())||a / b; // такой цвет через пройденное время
- var t = parseInt($('#i6').val())||255; // диапазон количество цветов
- $('#i0').val(n)
- $('#i1').val(o)
- $('#i2').val(m)
- $('#i3').val(a)
- $('#i4').val(b)
- $('#i5').val(c)
- $('#i6').val(t)
- 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); // цвет
- init($(".quard")[1], s, s, s, 1, 1, 1); // цвет
- init($(".quard")[2], Math.floor(a / (b + 0.002)) - t * (Math.floor((a / (b + 0.002)) / t)), 1, 1, 1, 1, 1); // цвет
- init($(".quard")[3], Math.floor(a / (b + 0.003)) - t * (Math.floor((a / (b + 0.003)) / t)), 1, 1, 1, 1, 1); // цвет
- interval.push(setInterval(function() {
- zapusk($(".quard")[0])
- }, 1));
- interval.push(setInterval(function() {
- zapusk($(".quard")[1])
- }, 1));
- interval.push(setInterval(function() {
- zapusk($(".quard")[2])
- }, 1));
- interval.push(setInterval(function() {
- zapusk($(".quard")[3])
- }, 1));
- }
- 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:250px;
- height:250px;
- border:1px solid #ccc;}
- .quard{
- width: 124px;
- height: 124px;
- 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">черно белое 0 и 255 случайно</label><input type="text" class="form-control" placeholder="черно белое 0 и 255 случайно" 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=""></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"></div>
- <div class="quard"></div>
- <div class="quard"></div>
- <div class="quard">
- </div></div></div>
- </div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement