Можем ли мы изменить шрифт Awesome speed speed?

У меня есть прядильный механизм на моем веб-сайте, отображаемый с помощью этого кода:

<link rel="stylesheet"
 href="#" onclick="location.href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css'; return false;"/>

<i class = "fa fa-cog fa-5x fa-spin"></i>

Ответ 1

Короткий ответ

Да, вы можете. Замените класс .fa-spin на значке новым классом с помощью собственного правила анимации:

.slow-spin {
  -webkit-animation: fa-spin 6s infinite linear;
  animation: fa-spin 6s infinite linear;
}

<link rel="stylesheet"
 href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"/>

<i class = "fa fa-cog fa-5x slow-spin"></i>

Ответ 2

Как и ответ Майкла Ласло. Это то, что я использую, чтобы сделать его быстрее для fa-refresh, поскольку fa-spin по умолчанию очень медленный.

.fa-spin {
 -webkit-animation: fa-spin 0.75s infinite linear !important;
 animation: fa-spin 0.75s infinite linear !important;
}

Я использую! важно, чтобы я контролировал специфику:)

Ответ 3

Не обязательно использовать собственную анимацию или определение класса. Скорость любой анимации css может контролироваться свойством css длительности анимации. Просто используйте:

.fa-spin {
  animation-duration: 3s; // or something else
}

Чем выше значение, тем ниже скорость анимации.