Tuesday, 15 April 2014

html - How to make the background color animate of an element? -


I'm trying to run colors (or background images) again, but this does not seem to work . I have tried the following, but it only changes once and does not release.

 . Landing-background {background color: red; Webkit-Animation-Name: Example; / * Chrome, Safari, Opera * / -WebKit-Animation-Duration: 4S; / * Chrome, Safari, Opera * / Animation-name: Example; Animation-period: 4s; Animation-repetition-count: infinity; } / * Chrome, Safari, Opera * / @ -WebKit-keyframe example {0% {background color: red; } 25% {background-color: yellow; } 50% {background-color: blue; } 75% {background color: green; } 100% {background-color: red; }} / * Standard syntax * / @ keyframe example {0% {background color: red; } 25% {background-color: yellow; } 50% {background-color: blue; } 75% {background color: green; } 100% {background-color: red; }}  

You are probably using another browser in comparison to Internet Explorer . Try adding:

  - Webkit-animation-repetition-count: infinite; / * Chrome, Safari, Opera * /  

EDIT:
Browse browsers to support prefixed (prefixed). Nowadays each browser supports it without the prefix, although not everyone has updated their browser. Probably the prefix is ​​completely safe to remove in mid-2017.


No comments:

Post a Comment