Верстка одностраничника
Необходимо выполнить верстку одностраничника под 3 различных разрешения экрана.
Верстка адаптивная, не резиновая и не ответственная (responsive).
Требования:
1) кроссбраузерная верстка на div'ах
2) разрешения экрана: 320px, 768px, 1280px
3) без совместимости с устаревшими браузерами
4) главное меню на css, без скриптов, ширина элемента LI зависит от количества текста в нем
-каждый элемент меню оформлен как ссылка A внутри элемента LI, активный элемент LI имеет класс .active (внутри элемента UL должны быть только теги LI и тег A, никаких дополнительных тегов!)
-при нажатии на элемент меню страница должна плавно прокручиваться к соответствующему блоку с информацией
-при прокрутке страницы те или иные элементы LI активируются и деактивируются автоматически (в зависимости от того, какой блок в данный момент на экране)
5) заголовки блоков должны быть однотонными, без градиента
6) кнопки в правой части страницы на разрешении 1280px должны быть приклеены всегда к правому краю экрана (по вертикали по центру), на других разрешениях этих кнопок не должно быть видно
7) из фреймворков допустимо использовать только jquery
8) используемые сторонние скрипты: share42, Яндекс.Карты, jQuery.Lightbox (fancybox либо Lightbox evolution), jQuery.Countdown, bx-slider либо jCarousel для каруселей
9) нестантартные шрифты — через Google fonts, иначе через FontSquirrel
10) при нажатии на кнопки "Заказать", "Задать вопрос" должна появляться форма обратной связи во всплывающем окне; при нажатии на картинки работ, отзывов - картинки в увеличенном виде во всплывающем окне (можно сделать ссылки на одну и ту же произвольно подобранную большую картинку)
11) при нажатии на кнопку "Отправить заявку" в форме обратной связи должны проверяться на заполненение поля в форме (без валидатора), если какое-то не заполнено - оно должно обводиться красной рамкой, если все заполнены - должно появляться Alert-сообщение с текстом "форма отправлена"
12) информационные блоки с заголовком желательно выполнить по такой структуре:
-div, у него указывается класс*, сразу же внутри DIV заголовок блока, сразу за ним идет div — он обрамляет контент блока, вот так:
-
заголовок
контент блока
-цвет текста в блоке, фон блока, рамка и т.п., задается (*) классом div
-заголовок блока h3 (есть не у всех блоков)
13) в блоке внизу карта должна быть сделана на всю ширину экрана, при прокручивании скролла на карте должна прокручиваться страница, а не увеличиваться/уменьшаться карта
14) любые кнопки, закругления делаются на css3
15) в блоке "Акция!" есть обратный отсчет времени, цифры должны быть написаны белым текстом на подложке
Файлы:
-PSD, TTF - сброшу архивом на почту
Пожалуйста, пишите сроки и стоимость работы. Предпочтение отдаю НЕ студиям.
Я ориентирован на долговременное сотрудничество.