alexalexes

а) Чтобы не было непоняток с форматом даты входной строки, подставляйте параметры явно:
new Date(yearVal, monthVal, dayVal)
б) Еще полезно привести время к одной величине для сравнения:

(new Date()).getTime() - (new Date(yearVal, monthVal, dayVal)).getTime()

PS: А вообще, возраст нужно считать по каждому компоненту даты, чтобы не нарываться на високосные года:

var now = new Date();
var age = (now.getFullYear() - yearVal - ((now.getMonth() - (monthVal - 1) || now.getDate() - dayVal) < 0 ? 1 : 0));

Принять данные от отправленной формы и отправить по почте письмо, заполненное по шаблону, аналогично полям формы.
Для реализации отправки можно воспользоваться встроенной функцией mail(). Можно написать свой велосипед для полноценной работы с smtp, а можно воспользоваться библиотекой, например, PHPmailer.
Для надежности перед отправкой лучше дополнительно записывать принятые заявки в БД.
Мало ли по каким причинам письма не будут слаться (на стороне вашего сервера и на стороне почтового сервиса есть очень много моментов, которые могут выстрельнуть).

У вас на странице куча миниатюр на 2500x2500 по ~1Мб каждая.
Идет гонка, кто быстрей загрузится: скрипты или картинки.
Скрипты находятся в конце, и они последние начинают загрузку.
Такое расположение скриптов рекомендуют разработчики Google.
Еще они рекомендуют делать упрощенный функционал сайта, пока скрипты не вступили в свою силу после того, тогда как загрузятся.
Что требуется этому сайту:
1) Создать и наладить отображение упрощенного стиля;
2) Найти баланс в размере миниатюр.

var node = this; // в ноду кладем текущий элемент Element;
// начинаем примерять селектор, двигаясь от текущего элемента к его родителям     
 while (node) // пока есть элемент (не null) (или на предыдущей итерации провалили матч и есть родитель)
 {
        if (node.matches(css)) // подходит селектор элементу ?
         return node; // возвращаем этот элемент, цикл останавливается
        else
         node = node.parentElement; // не подошло, устанавливаем на node родительский элемент, идем на следующую итерацию.
      }
return null; // цикл прошелся по всем родителям - ничего не нашли

----------
Подставляем свой "велосипед" closest в прототип элемента:
Element.prototype.closest = function (css)
-------------
Подставляем в прототип элемента метод matches любую доступную из перечисленных через || реализацию, если этот метод в разных браузерах называется по-разному, чтобы сгладить этот досадное недоразумение.

Element.prototype.matches = Element.prototype.matchesSelector || <подставьте любой метод, чтобы делал матч, но назывался не как у всех>

Не лучше ли background эксплуатировать для этих целей, меняя местами источники изображений?

<style>
      #elem1
      {
        display: block;
        width: 400px;
        height: 400px;
        background-image: url("back1.png"),
                          url("back2.png");
        transition: background-image 0.5s ease; /* для наглядности эффекта */
      }
    </style>
    <div id="elem1"></div>
    <script>
    var trigger = 0;
    setInterval(function()
    {
      var elem1 = document.getElementById('elem1');
      elem1.style.backgroundImage = trigger % 2 == 1 ? 'url("back1.png"), url("back2.png")' : 'url("back2.png"), url("back1.png")';
      trigger++;
    }, 1000);

    </script>

Среда выполнения JS в браузере изолирована от железа, поэтому тут нужна полноценная реализация клиент-серверного приложения.
Компьютер с COM-портом будет выступать в качестве веб-сервера.
На этом сервере необходимо реализовать серверный скрипт, который подключится к COM и будет осуществлять транзит по HTTP с клиентом - браузером.
А уже на стороне клиента API будет реализовано посредством JS, а получение данных - AJAX-ом.
Вот пример как сделать серверную часть на NodeJS.

Кнопку оставляете в покое, значение передаете скрытым полем.

<form action="?action=select_pay" method="POST">
<input type="hidden"  name="pay_mode" value="20"  />
<input type="submit" class="superbutton"  value="Яндекс Деньги"  />
</form>
<form action="?action=select_pay" method="POST">
<input type="hidden"  name="pay_mode" value="10"  />
<input type="submit" class="superbutton"  value="Еще одна платежка"  />
</form>

На мобильнике, как правило, есть тачскрин.
Я, обычно, проверяю наличие тач-обработчиков.
И не важно, что за устройство: яблоко, андроид и тд.

if ('ontouchstart' in document.documentElement) 
{
// есть сенсорный экран, значит, имеем дело с переносным гаджетом.
}
else
{
  // desktop версия кода
 (элемент ввода).focus(); //устанавливаем фокус
}

scheduler.attachEvent("onEventSave",function(id,ev,is_new)
{    
  var checked_users = ev.username.split(','); // переводим строку в список отмеченных id пользователей
  var new_text = ''; // сюда будем писать строку с именами пользователей
  var checked_users_count = checked_users.length; // кол-во отмеченных пользователей
  for (var i = 0; i < checked_users_count; i++)
  {
    var check_user_id = checked_users[i]; // текущий отмеченный id
    var ch_users = users.filter(usr => usr.key == check_user_id); // получаем человека из списка users по отмеченному id (на выходе тоже список, но не более 1 элемента)
    if (ch_users.length > 0)
      new_text += (new_text != '' ? ', ' : '') + ch_users[0].label; // вписываем в строку найденного пользователя
  }
  ev.text = new_text == '' ? 'Nobody' : new_text; // если никого не нашли, то как-то обозначаем эту ситуацию (Nobody)
  return true;
})

На стороне PHP пропустить полученный файл через GD библиотеку.
При необходимости, уменьшить качество выходного файла, и попутно сгенерировать preview, отправив его обратно клиентку (+ подтвердив получение сервером).
Учтите, придется увеличить доступный объем оперативной памяти для одного процесса PHP.
На моем опыте, чтобы GD проглотила 16 Мпикс картинку, нужно 128 Мб ОЗУ.
Перед скармливаем GD взвешиваем картинку с помощью getimagesize().
Если это не сделать, и с превышением лимита отдать на обработку библиотеке, то скрипт тихо-мирно заглохнет, не сообщив клиенту ничего, а так можно сгенерировать сообщение, что файл большой.

Сталкивался с такой особенностью, решал как раз через дополнительное поле hidden:

<label>
<input type="hidden" id="field_0_1" name ="param_list[0][field_1]" value="off"/>
<input type="checkbox" onchange="set_hidden_checkbox(this, 'field_0_1')"/>
</label>

function set_hidden_checkbox(target, id)
{
  var hidden = document.getElementById(id);
  if(hidden !== undefined)
     hidden.value = target.checked ? 'on' : 'off';
}

Атрибут value в hidden нужно инициализировать значением по умолчанию.

Анимация прокрутки происходит всегда за фиксированное время (сейчас 500 мс).
Если top получается 100 пикселей, то промотка будет казаться медленней, а если 1000 пикселей - то быстро.
А нужно сделать так, чтобы время анимации было пропорционально длине "прыжка".

var anim_speed = 300; // пикселей в секунду
var anim_time = (top * 1000) / anim_speed; // 1000 - поправка на милисекунды
//анимируем переход на расстояние 
$('body,html').animate({scrollTop: top}, anim_time);

PS: Обычная школьная формула по физике: время равно расстоянию деленное на скорость.