Сверстать готовый дизайн с параллакс-эффектом

Только для фрилансеров из Украины.

Необходимо сверстать готовый одностраничный дизайн (.psd) с небольшим вертикальным параллакс эффектом. При вертикальном скролле хедер с меню прилипает к верху экрана, чуть уменьшается по ширине и выделяет активным тот пункт меню, который сейчас отображается. При клике на пункте меню происходит его выделение скролл к нужной секции. Горизонтельные секции при скролле так же немного меняют свою ширину для создания параллакс эффекта. Желательно иметь возможность так же использовать браузерный скролл справа.

Браузеры

Сайт должен быть адаптивным, корректно отображаться на десктопах (IE, FF, Chrome, Safari), планшетах и смартфонах. Для смартфонов нужно продумать как отображать контент и возможно некоторое ограничение функциональности - обсуждаемо.

Для планшетов возможно добавление видимых кнопок вперед / назад, которые заменяли бы скролл вперед-назад - обсуждаемо.

Активные элементы

• Get an invite (в хедере) - установка курсора в инпут-поле ниже и скролл к этому полю для получения инвайта


• Sign in (в хедере) - модальное окошко с полями логина/пароля, аякс запрос на логин, отображение ошибки или перезагрузка страницы при успехе


• Build / Follow / Track - кликабельны, при клике надпись выделяется как активная (быстрая анимация), заменяется большая картинка графика слева и пункты в виде черных полосок снизу (их может быть разное количество). Эти пункты так же кликабельны, активный чуть сдвигается влево анимацией и выделяется цветом. Для каждого такого пункта тоже меняется левая картинка.


• Инпут для ввода емейла и кнопка Get an invite - отправка аякс запроса при клике или нажатии Enter и отображение ошибки / сообщения об успехе


• Картинка графика слева - в будущем будет заменена на анимацию на джаваскрипте (не входит в эту часть работ), поэтому нужен джаваскриптовый хендлер для событий начала и конца отображения картинки. Сейчас этот хендлер должен просто переключать картинки.

Анимация при скролле

При скролле сайта с самого верха в самый низ в тот момент, когда центральная часть с графиком касается верха, она замирает и последовательно переключаются пункты выделенные черным фоном, потом переключается пункт выше (Build -> Follow -> Track) и только после последнего пункта продолжается скролл вниз.

Сегменты Features и What people say не имеют активных элементов.

Используемые фреймворки

• jQuery


• Bootstrap (по желанию)


• animate.css

Оплата

Перевод через сервисы Приватбанка (карточка, Liqpay) или наличиные (Киев) по завершению работы.

При заявку указывайте стоимость работ и сроки, пожалуйста.