2015-09-19 2 views
0

У меня есть код CSS, который работает на Chrome очень хорошо,CSS код для IE и Firefox

.glow { 
     -webkit-animation-duration: 1s; 
     -webkit-animation-name: glow; 
     -webkit-animation-direction: alternate; 
     -webkit-animation-iteration-count: infinite; 
     animation-duration: 1s; 
     animation-name: glow; 
     animation-direction: alternate; 
     animation-iteration-count: infinite; 
     color: white; 
     font-family: 'Limelight', cursive; 
     font-size: 90px; 
     z-index: 555; 
     padding-top:25px; 
    } 

    @-webkit-keyframes glow { 
     from { text-shadow: 0 0 5px maroon; } 
     to { text-shadow: 0 0 15px maroon; } 
    } 

Я полный новичок в CSS, пожалуйста, вы можете помочь мне понять, какие изменения необходимо сделать, чтобы сделать эта работа над Internet Explorer & firefox.

Спасибо и простите меня, если я нарушаю правила SO, отправляя вопрос, не пытаясь.

JSFiddle

Лакс.

+0

Проверьте мой ответ, я протестировал его на Chrome и Firefox, вы попробуете его в IE. Мой код работает для меня! –

ответ

1

Попробуйте это. Я использовал авто префикс для кросс-браузерной совместимости:

.glow { 
    -webkit-animation-duration: 1s; 
      animation-duration: 1s; 
    -webkit-animation-name: glow; 
      animation-name: glow; 
    -webkit-animation-direction: alternate; 
      animation-direction: alternate; 
    -webkit-animation-iteration-count: infinite; 
      animation-iteration-count: infinite; 
    -webkit-animation-duration: 1s; 
      animation-duration: 1s; 
    -webkit-animation-name: glow; 
      animation-name: glow; 
    -webkit-animation-direction: alternate; 
      animation-direction: alternate; 
    -webkit-animation-iteration-count: infinite; 
      animation-iteration-count: infinite; 
    color: white; 
    font-family: 'Limelight', cursive; 
    font-size: 90px; 
    z-index: 555; 
    padding-top:25px; 
} 

@-webkit-keyframes glow { 
    from { text-shadow: 0 0 5px maroon; } 
    to { text-shadow: 0 0 15px maroon; } 
} 

@keyframes glow { 
    from { text-shadow: 0 0 5px maroon; } 
    to { text-shadow: 0 0 15px maroon; } 
} 
Смежные вопросы