Переход transition в CSS

Свойство CSS transition получает три параметра.

Первый параметр: отвечает за изменением каких css свойств нужно следить, например, width, left и т.д. на ваше усмотрение. Здесь вы можете использовать значение all и в этом случае будут отслеживаться изменения у всех свойств.

Второй параметр: отвечает за время анимации (в секундах), например, 0.7s.

Третий аргумент: название временной функции.

CSS

    #id_of_element {
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    }

Отличный инструмент для понимание того, как работает та или иная функция: matthewlein.com/ceaser, также вы можете, используя данный сервис, задать свою собственную временную функцию.