Иконки сделаны обычным шрифтом, а их анимация через банальный css, который можно без проблем изучить на самом сайте. Клик ловится через jQuery, дальше определяется что за иконка была кликнута и с помощью .html() функции в том же jquery подставляется вместо менюшки разметка вашего поиска опять же с с анимацией (идеал - даже без html а просто на основе fadeIn fadeOut запилить просто). То есть клик по лупе - fadeOut для меню и fadeIn для поля поиска, при клике по крестику - наоборот. Обе функции и описание про них опять же на сайте jquery найдете иль где ещё в инете, шарьтесь по документации в общем.
Простой
