Достаточно долгое время навигация по сайту (меню), как правило, находилась в левой или верхней части экрана. Анимация тоже была простой — подчеркивание, изменение цвета или толщины букв самих пунктов меню.
По мере распространения и совершенствования Javascript и CSS анимация становилась более плавной, интересной и разнообразной.
С появлением адаптивных версия сайтов под мобильные устройства пришла и пиктограмма "гамбургера" — нового стандарта, который позволял дизайнерам скрывать часть или даже большинство ссылок меню до тех пор пока они не понадобятся посетителю сайта для перехода в тот или иной раздел.
В этом посте продемонстрируем различные примеры всплывающих навигационных меню на российских и зарубежных сайтах.
Меню плавно появляется и занимает весь экран. Есть строка поиска и все основные разделы по сайту.
Мгновенное появление меню без анимации с основными разделами каталога и частично с подразделами.
Плавное появление меню с второстепенными подразделами сайта. Открывается во всю ширину в верхней части экрана.
Анимации нет. Меню из бургера делает акцент на основных разделах каталога, мгновенно их подсвечивая. При наведении на основные пункты меню показываются и подразделы + графический баннер товара или акции.
Update. Примеры будем добавлять...