@istasiik

Почему не работает css анимация в firefox?

Здравствуйте! В файрфоксе появился баг в css анимации (во всех остальных такого нет):

2) Я включаю скрипт, который добавляет к элементу следующую анимацию.
@-webkit-keyframes active {
  0% {
  }
    
    40% {

      min-width: 107px;

  }
    
    50% {
      min-width: 96px;

  }
    
    60% {
      min-width: 105px;

  }
    
   70% {
      min-width: 100px;

  }
    


  100% {
      border-color: #71DE04;
      color: #71DE04;
      min-width: 100px;
  }
}

@keyframes active {
  0% {
  }
    
     40% {

      min-width: 107px;

  }
    
     50% {
      min-width: 98px;

  }
    
     60% {
      min-width: 102px;

  }
    
     70% {
      min-width: 100px;

  }


  100% {
      border-color: #71DE04;
      color: #71DE04;
      min-width: 100px;

  }
}

.active {
  -webkit-animation-name: active;
    -moz-animation-name: active;
          animation-name: active;
}


У этого элемента нет постоянной ширины, поэтому если его ширина меньше 110x с помощью min-width он несколько раз сокращается и меняет цвет. Везде это работает, кроме файрфокса. В файрфоксе он только меняет цвет. В чем может быть проблема?
  • Вопрос задан
  • 3148 просмотров
Решения вопроса 1
@istasiik Автор вопроса
Решение - добавить любой min-width в изначальный класс элемента.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы