Анимация заливки градиентом текста

@KISS_ARMY · Регистрация: 03.07.2013

Author24 — интернет-сервис помощи студентам

Добрый делаю градиент у текста css взял от сюда http://shpargalkablog.ru/2013/... -text.html (самый нижний пример)

CSS

.dva {
  position: relative;
}
.dva:after {
  content: "";
  position: absolute; top: 0; left: -2em;
  width: 100%;
  height: 100%;
  background: linear-gradient(to left, rgba(255,255,255,.0), rgba(255,255,255,.8), rgba(255,255,255,.0)) no-repeat -2em 0%;
  background-size: 2em 100%;
  transform: skewX(-50deg);
}
.dva:hover:after {
  transition: 2s linear;
  background-position: 100% 0%;
}

Все бы ничего но анимация доходит до последнего слова и стопорится, в чем может быть проблема?

Добавлено через 9 минут
Если текст делаю короче, то норм

@mrtoxas · 17.11.2016, 21:35

Приведите код, который даст возможность воспроизвести проблему. Пока все работает, как при коротком тексте, так и при длинном.

@mrtoxas 3825 / 2675 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	17.11.2016, 21:35	2
	Приведите код, который даст возможность воспроизвести проблему. Пока все работает, как при коротком тексте, так и при длинном. 0