2015-12-10 5 views
1

Спецификация для анимации ключевого кадра says, что !important будет игнорироваться в ключевых кадрах - это недопустимо, если в объявлении анимации установлено значение inline.! Important with keyframe animations

Из примера спецификации:

@keyframes important1 { 
    from { margin-top: 50px; } 
    50% { margin-top: 150px !important; } /* ignored */ 
    to { margin-top: 100px; } 
} 

@keyframes important2 { 
    from { margin-top: 50px; 
     margin-bottom: 100px; } 
    to { margin-top: 150px !important; /* ignored */ 
     margin-bottom: 50px; } 
} 

Есть известный обходной путь для этого?

+4

Чтобы обойти эту проблему, чтобы исправить ваш CSS поэтому '! Important' не надо – dave

+2

Что вы пытаетесь достичь? Ваш пример на самом деле не имеет смысла, так как зачем вам «margin-top» быть '! Important' только на определенных этапах анимации? На самом деле это ничего не изменит, даже если это не будет проигнорировано. Я понимаю, что это может быть просто пример кода, который ничего не делает, просто чтобы проиллюстрировать вопрос, но я думаю, что главное, что нам нужно знать, это просто «Что вы пытаетесь сделать, что думаете, что вам это понадобится?» И, может быть, мы сможем помочь вам с этого фронта. –

+0

@BlakeMann Это не мой пример. Это из спецификации. –

ответ

1

Есть действительно только два варианта:

  1. переписывании кода CSS, чтобы избежать использования !important
  2. Использование JavaScript анимации вместо CSS-анимации. Решение JavaScript сможет изменять любые встроенные стили или даже на уровне документа stylesheets при необходимости