Требуется адаптивная верстка

Desktop и Mobile версии предоставлены в Figma www.figma.com/file/eU7sUA...

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

1. Все иконки, и векторные объекты Figma по возможности разместить как SVG.

2. Видео слайдер должен прокручиваться согласно макету, и приложенным картинкам. При клике по слайдеру показывается popup с видео, видео ставится на проигрывание. Все 8 блоков видео слайдера отрисованы в макете отдельно (3 колонка внизу).

3. Видео во всплывающем окне, занимает 90% ширины экрана. Встроенный плеер, не Youtube. Для демонстрации можно поставить любое видео.

4. Форму обратной связи проверять на корректность полей: email, тел, текстовые непустые поля. Если все корректно сделать пустой Ajax вызов (без проверок успешности).

5. Весь JS реализовать на JQuery.

6. По мере скрола страницы вниз некоторые графические элементы:
• Шапка: Желтая лампа
• Особенности моделей: стрелочки и страницки на которые они указывают. Сначала рисуются стрелочки, дальше с небольшой задержкой «выезжают» странички или фото.
4 шт.
• License id: оводка + стрелка и дальше картинка на которую указывает стрелка.
• Новое определение: желтая рука и дальше картинка с клавиатурой.
• Стандарт безопасности: синие иконки последовательно и дальше желтый щит
• Модели в линейке: желтые стрелки
• Видео линейки: фиолетовая камера и дальше включается видео слайдер.
• Инновации в лучшем виде: подчеркивание и дальше фото брошюры.
• Хотите узнать больше: фиолетовые рамки.

7. Все состояния кнопок и стрелок брать согласно UI kit (есть в макете).

8. Черный Мини-слайдер моделей (в блоке «Модели в линейке») сделать согласно макету. При клике по названию модели меняется:
- активный пункт в слайдере
- 3 пункта характеристик
- название модели на желтом фоне.
- возможно (пока не делать, но предусмотреть, если понадобится) фото модели.

9. При клике на блок « + технические характеристики» открывать popup как в макете. Popup с характеристиками должен быть свой для каждой модели (в верстке текст можно оставить один и тот же для всех popup).

10. Верхнее и нижнее меню плавно скролит до нужно подпункта внутри страницы.

Опубликовано 3 года назад