CSS анимация не работает. (ключевые кадры между семействами шрифтов) Альтернатива?
Я заранее прошу прощения, я знаю, что должно быть какое-то простое решение, но я просто не нахожу никакого.
Прямо сейчас я использую эту простую технику для замены шрифтов на веб-странице в качестве анимации. Проблема в том, что только последняя версия Chrome, кажется, знает, что я пытаюсь сделать. Есть ли альтернатива этому в jQuery?
@keyframes switch {
0% {font-family: Comic Sans;}
50% {font-family: Arial;}
100% {font-family: Comic Sans;} }
1 ответ
Решение
Вот быстрое воспроизведение анимации вашего ключевого кадра в jQuery.
var $switcher = $('#switcher');
function switcher() {
$switcher.toggleClass('arial comicsans');
}
setInterval(switcher, 1000);
.arial { font-family: Arial; }
.comicsans { font-family: Comic Sans'; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="switcher" class="arial">This is a test</div>