Event Animationstart
## Definition and Usage
The `animationstart` event occurs when a CSS animation starts.
This event is supported in all modern browsers.
## Syntax
```javascript
element.onanimationstart = function(){ myScript };
## Browser Support
| Browser | Support |
|---------|---------|
| Chrome | Yes |
| Firefox | Yes |
| Safari | Yes |
| Edge | Yes |
## Example
When the animation starts, change the background color of the div:
animationstart Event
.box {
width: 100px;
height: 100px;
background-color: red;
position: relative;
animation: mymove 5s infinite;
}
@keyframes mymove {
from {left: 0px;}
to {left: 200px;}
}
function myFunction(element) {
element.style.backgroundColor = "blue";
}
YouTip