Закончить вёрстку главной страницы сайта

Антон9 лет в сервисе

Данные заказчика будут вам доступны после подачи заявки

31.05.2016

Задача

Закончить вёрстку главной страницы сайта для презентации заказчику.

Макеты приложены к проекту. Прикладываем только для одного разрешения, после утверждения исполнителя предоставим полный комплект psd.

Предыдущий исполнитель не справился с задачей. Все что он сделал можно посмотреть в архиве "Верстка". Сейчас отсутствует правое меню (его раскрытие), подгрузка карточек товаров при скролле, сайт адаптируется под маленькие разрешения (нужно убрать эту возможность. Минимальное разрешение должно быть 1336 px.), немного доработать анимации и ховеры кнопок.

все файлы по проекту тут https://yadi.sk/d/By28DRC9rqh4F

Требования

• HTML5, CSS3, jQuery;

• Адаптивная верстка (3 точки прерывания);

• Аккуратный, логичный, продуманный код;

• Использование svg (иконки);

• Продуманная аккуратная анимация;

• Работа в тесной связке с дизайнером курирующим проект.

Обязательное условие чтобы большинство того что видно на макетах работало (было кликабельно, двигалось).

Больше подробностей в личной переписке. Возможно внесение небольших правок при приёмке работ.

Адаптивность

Каталог товаров и правое меню

Левое и правое меню фиксируется и при любых разрешениях остается неизменным по ширине, но меняет свою высоту, смещая элементы таким образом чтобы они всегда были видны пользователю.

Сетка с товарами и баннерами

Можно разбить эти блоки по смыслу и поведению на сайте.

1. Главный слайдер на сайте изменяется только по ширине

2. Сетка с 2 баннерами (один с таймером, второй с роллом и надписью "название акции") и тремя товарами в правой части. Изменяется размер блоков сохраняя отступы друг от друга.

Сетка с товарами

Сами блоки не меняют размер на тех разрешениях которые будут сверстаны на данном этапе. Меняется только количество товаров в рядах. 3,4,5.

Разрешения экранов

2500, 1920, 1337

Анимации элеметов

"Купить"

https://d13yacurqjgara.cloudfront.net/users/116465/screenshots/2551579/download-button.gif

https://dribbble.com/shots/1426764-Submit-Button

"Популярное, акция, Новинки, Всё меню, обратный звонок"

https://d13yacurqjgara.cloudfront.net/users/283373/screenshots/2138517/sullivan-buttons.gif

"Найти курьера на карте"

https://d13yacurqjgara.cloudfront.net/users/104778/screenshots/2201051/button.gif