Крутые сайты для бизнеса

Анимация на CSS3

В настоящее время активно развивается CSS3, и все больше его свойств поддерживаются современными браузерами. 
Сегодня мы поговорим о том, как с помощью CSS3 создать анимацию, для этого нам понадобиться свойство transition. 

Рассмотрим простой пример: 

a { 
    background: #000; 
    color: #fff; 
    transition: all 0.5s ease; 
    } 
a:hover { 
    background: #fff; 
    color: #000; 
    } 
  
Данный код при наведении мышки будет изменять background и color плавно в течении полусекунды. 

Если нам необходимо выполнять анимацию для каждого свойтсва в отдельности можно поступить так: 

a { 
background: #000; 
      color: #fff; 
transition: background 0.5s ease; 
transition: color 0.3s ease; 

a:hover { 
    background: #fff; 
    color: #000; 
 } 

В данном примере время выполнения анимации для каждого свойства указано отдельно. Так же можно добавить задержку анимации с помощью transition-delay: 0.5s; С помощью данного свойства можно анимировать практически любые свойства CSS.

Есть интересный проект?

Давайте продумаем его и реализуем. Для начала свяжитесь с нами любым удобным для вас способом.

Хочешь работать у нас?

Посмотри, что у нас есть для тебя в разделе вакансии.

Есть вопросы?

Воспользуйтесь формой обратной связи или просто позвоните нам, мы с радостью на них ответим.

Звоните: +7 (861) 290-03-08

Пишите: info@webemot.com