Адаптивное меню и поиск на мобильном, повторить функционал из шаблона

Цена договорная • наличный расчёт, безналичный расчёт, электронные деньги
25 июля 2018, 09:32 • 2 отклика • 25 просмотров
Работающий сайт https://allfinancelinks.com/
При
адаптации на мобильный вид поисковая строка и меню при клике по кнопки
поиска и меню появляются и исчезают определенным образом

При
клике по кнопке поиск происходит анимация и кнопка меню заменяется на
кнопку "закрыть" для поисковой строки, при этом поисковая строка
появляется ниже хедера и остальная часть страницы затемняется.

При
клике по меню слева появляется меню, оно "сложено" по заголовкам, при
этом при клике по заголовку открываются дочерние элементы.

В общем, функционально можно посмотреть на сайте с любого устройства.
----
Был разработан новый макет. Построен
на bootstrap 4. Как есть перенести данный функционал не удалось в связи
с изменениями в именовании элементов и верстки. Сейчас в шаблоне
вставлены "заглушки" кнопок.
Новый шаблон можно увидеть на данной странице https://allfinancelinks.com/forward_market

Архив с версткой и файлами CSS, JS
шаблон страницы в формате HTML со всеми стилями и JS (DROPBOX)
Используется последняя версия JQUERY Minified

В приложении также скриншоты, как выглядит меню и поиск на мобильном телефоне.

Задание
Полностью
повторить функционал и анимации для поисковой строки и меню при
мобильном просмотре. Чтобы все корректно открывалось, закрывалось,
затемнялось.
Дополнительно добавить:
1. в меню
при клике по заголовку, если он "открыт", то открытая часть должна
закрываться. Сейчас при клике открывается часть и закрыть повторным
кликом нельзя.

Результат
Архив с файлами HTML, кодом JS для меню в отдельном файле + изменения в верстке и CSS нужно обязательно обозначить.
Файлы
Отзывы
R50 5827202a6088f76c6d07a846c6ad5861
Заказчик
Все сделано точно и в срок, спасибо!
5 лет назад