Дано:
Макет дизайна лендинга в PSD
Требуется выполнить верстку.
В идеале в одной вкладке я открываю jpg дизайна, в другой – свёрстанную страницу, они должны быть одинаковы.
Вёрстка:
Кроссбраузерная
Чистый, валидный код (без style и комментариев)
Все тексты, нужно сделать именно текстом
Кнопки, при наведении мышкой сделать зелёными, и при клике на них убрать тень, то есть эффект нажимания на кнопку
Нужно сделать так, при уменьшении экрана устройства, что бы вёрстка не "сплющивалась", а была как бы фиксированной, пример тут –
Скрипты:
При нажатии на кнопки "Отправить фото" (ну кроме формы в футоре), экран должен затемняться и открываться форма заказ в лайтбоксе (она отрисована в макете)
В блоке – "пришлите нам фото и получите поп арт" – слайдер. Слайдер должен проматываться автоматически по кругу, каждый 2 секунды. Так же при кликах на стрелки, слайдер пристыковывается в нужную сторону
Форма заказ (в лайт боксе и в футере):
После того как человек нажал на кнопку "выбрать" файл, выбрал файл и нажал загрузить, отразился процесс загрузки файла (может какой то шкалой, или гифкой загрузки. Пример можно тут посмотреть –
Так же нужно сделать какую то защиты на загрузку файлов, либо по расширению, либо генерировать названия, что бы нельзя было загрузить php скрипт и т.д.
В форме обязательное поле – телефон. Нужно сделать проверку этого поля, если поле не заполнено или заполнено буквами, надо вывести сообщение красным цветом – Введите корректный номер. При наводе мышкой на поле телефон, нужно показать шаблон +7 (___) ___-__-__ пример можно посмотреть тут –
После того как пользователь заполнил поля, и нажал на кнопку "отправить фото", все данные и файл должен отправиться на две почты, а пользователя перекидывать на страницу order.php (её нужно создать и сделать там просто текст "Заказ оформлен")
Сроки: до 2 дней
Оплата: Постоплата на карту сбербанка или ЯД или ВМР