„Błysk” koloru przy użyciu czystych przejść css

Próbuję dać użytkownikom „błysk” koloru, gdy pojawi się zdarzenie kliknięcia. Mogę uzyskać kolor, aby wyglądał przyjemnie, używając przejścia, jednak chcę, aby kolor zniknął po .5s, bez usuwania klasy „aktywnej”. Jednym z wymagań jest jednak to, że nie mogę używać animacji jQuery i to musi być zrobione w CSS.

Poniżej znajduje się css, którego obecnie używam.

.active{
  background-color: yellow;
  -webkit-transition: background-color .5s linear;
  transition: background-color .5s linear;
}

Próbowałem podać drugą wartość, jednak nie sądzę, aby była to poprawna oznaka, ponieważ nie działa.

.active{
  background-color: yellow;
  -webkit-transition: background-color .5s linear, background-color:transparent .5s linear;
  transition: background-color .5s linear, background-color:transparent .5s linear;
}

http://jsbin.com/itivum/1/edit

questionAnswers(4)

yourAnswerToTheQuestion