html - Very basic CSS animation not working in IE11 -
i have problem basic animation not work in ie11. work in mozilla x86/x64, opera , chrome.
while animation plays fine in other browsers, ie11 shows nothing until animation time over, , shows text. created fiddle show problem.
.fade { animation: fade 5s; } @keyframes fade { 0% { opacity: 0; } 100% { opacity: 1; } }
<table> <tr class="fade"> <td>i</td> <td>am</td> <td>a</td> <td>table</td> <td>row</td> </tr> </table>
you need add microsoft vendor css prefix
.fade { -o-animation: fade 5s; -moz-animation: fade 5s; -webkit-animation: fade 5s; animation: fade 5s; } @-o-keyframes fade { { opacity: 0; } { opacity: 1; } } @-moz-keyframes fade { { opacity: 0; } { opacity: 1; } } @-webkit-keyframes fade { { opacity: 0; } { opacity: 1; } } @keyframes fade { { opacity: 0; } { opacity: 1; } }
<table> <tr class="fade"> <td>i</td> <td>am</td> <td>a</td> <td>table</td> <td>row</td> </tr>
Comments
Post a Comment