Генератор случайных цифр. Фотограф Константин Шамин

Генератор случайных цифр

Виджет генератора случайных чисел.
— задается диопазон «от» и «до»;
— старт в один клик;
— перебор других значений до того самого выигрышного
Область применения: розыгрыши, выбор победителей из пронумерованного списка и все со своим брендированием

Пример оформления

(пример розыгрыша взят тут)


Друзья, Ланселот вместе с Minerva De Vi Photography хочет подарить одному из вас возможность сделать прекрасные фотографии с Ланселотом абсолютно бесплатно! Поэтому мы устраиваем розыгрыш фотосессии.

И сегодня пришло время подвести итоги!

Генератор случайных цифр. Фотограф Константин Шамин
?

Как это сделано

Код виджета как обычно вставляется в HTML-блок

<style>
#generator {
   text-align: center;
   cursor: pointer;
}
.number_size_100 {
   font-size: 250px;
}
.number_size_1000 {
   font-size: 180px;
}
.number_size_10000 {
   font-size: 140px;
}
.colorize {
   color: #990000; /* цвет цифры-победителя */
}
input {
   width: 100px;
   box-shadow: none;
   color: inherit;
   font-size: 15px;
   line-height: 1.5;
   vertical-align: top;
   padding: 12px 14px;
   outline: none;
   transition: background 0.3s;
   border: 0;
   border-radius: 10px;
   background: rgba(53,53,53,0.05);
}
</style>

<script>
function generate(min,max) {
   return Math.round(Math.random() * (max - min) + min);
};

function psora(k, n) {
  var r = Math.PI * (k ^ n)
  return r - Math.floor(r)
}

$(document).ready(function () {
   $("#generator").on("click", function(){
      $("#generator").removeClass("colorize");
      if ($("#max").val()>=100) { $("#generator").removeClass("number_size_10000 number_size_1000").addClass("number_size_100"); }
      if ($("#max").val()>=1000) { $("#generator").removeClass("number_size_100 number_size_10000").addClass("number_size_1000"); }
      if ($("#max").val()>=10000) { $("#generator").removeClass("number_size_100 number_size_1000").addClass("number_size_10000"); }

      var n=0;
      for (var i = 0; i < 20; i++) {
         setTimeout(function() {
            var randnum = generate($("#min").val(),$("#max").val());
            $("#generator").html(randnum);
            n++;
            if (n==20) { $("#generator").addClass("colorize"); }
         }, 100 * i);
      };
   });
});
</script>

<div style="width:100%; text-align:center;">
   <label for="min">От</label>
   <input type="number" value="1" id="min" name="min" class="field">
   <label for="max">До</label>
   <input type="number" value="100" id="max" name="max" class="field">
</div>

<div id="generator" class="number_size_100">?</div>

Расстановку блоков при оформлении конкретно этого примера можно посмотреть на стриншоте

Моды для Wfolio.ru

Генератор случайных цифр. Фотограф Константин Шамин

Виджет. Кнопка сохранения контактов

Данный виджет генерирует vCard — электронную визитку и её QR-код. Визитка поддерживает: — ФИО, — род...
Генератор случайных цифр. Фотограф Константин Шамин

Модицикация: выделение заголовка другим цветом

Иногда бывает необходимо выделить один или несколько заголовков другим цветом.
Генератор случайных цифр. Фотограф Константин Шамин

Модификация пакетов услуг

Модификация блока с ценами на пакеты услуг с помощью CSS/JS: — выравнивание высоты блоков с пакетами услуг в версии...
Генератор случайных цифр. Фотограф Константин Шамин

Модификация мультиссылок (taplink)

Модификация страницы с мультиссылкой с помощью CSS: — изменение отступов между кнопками; — изменение размера текста...
Генератор случайных цифр. Фотограф Константин Шамин

Удаление сообщения о Cookie на отдельной странице

Если вы включили Cookie на сайте (Настройки — Разные настройки — Уведомление об использовании cookie (GDPR)),...
Генератор случайных цифр. Фотограф Константин Шамин

Изменение цвета кнопок на отдельной странице

Генератор случайных цифр. Фотограф Константин Шамин

Скрываем блок от Инстаграм

Генератор случайных цифр. Фотограф Константин Шамин

Добавлние кнопок к форме обратной связи

Генератор случайных цифр. Фотограф Константин Шамин

Виджет обратного отсчета

Генератор случайных цифр. Фотограф Константин Шамин

Меняем светлую тему на темную (или любую другую)

Генератор случайных цифр. Фотограф Константин Шамин

Запрет индексации отдельной страницы

Генератор случайных цифр. Фотограф Константин Шамин

Скрытие пунктов меню в зависимости от языка сайта