Как сделать анимированный поиск?

[shake1]

Зачем поверх, - замени все из примера, ..стили рихтануть под свой дизайн, почему нет?

 

[Sylon]

Зачем поверх, - замени все из примера, ..стили рихтануть под свой дизайн, почему нет?

Код в сообщении выше, посмотрите, пожалуйста, поймёте, что там просто так не воткнуть этот код. Там прописано много функций, плюс проверка на ширину экрана.

 

[polyerter]

А через CSS не получается? Например,

input#search {
    width: 0px;
    float: right;
    border-width: 0px;
}
input#search:hover {
    width: 100%;
    border-width: 1px;
}