Калькулятор стоимости и интерактивная информация
 

Вопроса два, но они для знающих людей простецкие, не надо разбираться в чужом коде, просто поделиться немножно мудростью с новичком)
Необходимо реализовать на лэндинге два раздела, с которыми раньше не сталкивался:
1 интерактивное инфо о продукте - при наведении мыши на определенные элементы отображается информация по ним.
Реализовал посредством адаптивной таблицы div-ов 5х5, каждый из которых имеет свой id, ну и .mouseenter вызывает информацию в зависимости от области наведения
Вопрос №1: какими средствами можно сделать изящнее данный раздел, так как точность страдает

2 калькулятор стоимости - юзер выбирает цвет, размер итд изделия для того чтобы сформировать конфигурацию изделия, в реальном времени отображается стоимость того, что он насобирал и формируется заказ (php отправка на почту)
Вопрос №2: вот тут я в тупике( как это можно реализовать, хотя бы в общих чертах? чем это можно сделать - нужно ли копать в jQuery UI или юазовым функционалом можно обойтись?

Заранее спасибо

Хоть подскажите, как называются эти элементы, что гуглить:cray:

В чём проблема? Я так понимаю, что юзер выбирает цвет, размер итд изделия с помощью обычного селекта. У обычного селекта есть событие onchange. Можете повесить на него функцию и делать там что хотите - всё DOM-дерево страницы в вашем распоряжении.
когда юзер набрал всё что ему нужно он нажимает кнопку заказать, которая является <input type="submit" value="Заказать"> и находится внутри какой то формы <form action="just_do_it.php" method="post">
Значит внутри just_do_it.php вы можете отправить письмо.
P.s. помните, что библиотека jQuery написана целиком на JS. Это означает, что всё что написано на jQuery можно заменить js-кодом; мб немного больших размеров...

CSS