AnimationPlaybackEvent.AnimationPlaybackEvent() - Web APIs
the animationplaybackevent() constructor of the web animations api returns a new animationplaybackevent object instance.
... syntax var animationplaybackevent = new animationplaybackevent(type, eventinitdict); parameters type a domstring representing the name of the event.
... specifications specification status comment web animationsthe definition of 'animationplaybackevent()' in that specification.

AnimationPlaybackEvent - Web APIs
the animationplaybackevent interface of the web animations api represents animation events.
... constructor animationplaybackevent.animationplaybackevent() constructs a new animationplaybackevent object instance.
... attributes animationplaybackevent.currenttime the current time of the animation that generated the event.
...And 2 more matches

GlobalEventHandlers.onplay - Web APIs
the onplay property of the globaleventhandlers mixin is the eventhandler for processing play events.
... syntax element.onplay = handlerfunction; var handlerfunction = element.onplay; handlerfunction should be either null or a javascript function specifying the handler for the event.
... example <p>this example demonstrates how to assign an "onplay" event to a video element.</p> <video controls onplay="alertplay()"> <source src="mov_bbb.mp4" type="video/mp4"> <source src="mov_bbb.ogg" type="video/ogg"> your browser does not support html5 video.
... </video> <p>video courtesy of <a href="http://www.bigbuckbunny.org/" target="_blank">big buck bunny</a>.</p> <script> function alertplay() { alert("the video has started to play."); } </script> specification specification status comment html living standardthe definition of 'onplay' in that specification.

GlobalEventHandlers.onplaying - Web APIs
the onplaying property of the globaleventhandlers mixin is the eventhandler for processing playing events.
... syntax element.onplaying = handlerfunction; var handlerfunction = element.onplaying; handlerfunction is either null or a javascript function specifying the handler for the event.
... specification specification status comment html living standardthe definition of 'onplaying' in that specification.

AnimationPlaybackEvent.currentTime - Web APIs
the currenttime read-only property of the animationplaybackevent interface represents the current time of the animation that generated the event at the moment the event is queued.
... specifications specification status comment web animationsthe definition of 'animationplaybackevent.currenttime' in that specification.

AnimationPlaybackEvent.timelineTime - Web APIs
the timelinetime read-only property of the animationplaybackevent interface represents the time value of the animation's timeline at the moment the event is queued.
... specifications specification status comment web animationsthe definition of 'animationplaybackevent.timelinetime' in that specification.

Index - Web APIs
92 animationplaybackevent api, animation, animationplaybackevent, experimental, interface, reference, events, waapi, web animations api the animationplaybackevent interface of the web animations api represents animation events.
... 93 animationplaybackevent.animationplaybackevent() api, animation, animationplaybackevent, animationplaybackevent(), constructor, experimental, reference, waapi, web animations api the animationplaybackevent() constructor of the web animations api returns a new animationplaybackevent object instance.
... 94 animationplaybackevent.currenttime api, animation, animationplaybackevent, attribute, experimental, property, reference, currenttime, waapi, web animations api the currenttime read-only property of the animationplaybackevent interface represents the current time of the animation that generated the event at the moment the event is queued.
...And 2 more matches

Document - Web APIs
globaleventhandlers.onplay is an eventhandler representing the code to be called when the play event is raised.
... globaleventhandlers.onplaying is an eventhandler representing the code to be called when the playing event is raised.

GlobalEventHandlers.onanimationiteration - Web APIs
var box = document.getelementbyid("box"); var iterationcounter = 0; box.onanimationiteration = function(event) { box.style.animationplaystate = "paused"; document.getelementbyid("play").innerhtml = "start iteration #" + (iterationcounter+1); }; this sets up two global variables: box, which references the "box" element that we're animating, and iterationcounter, which is initially zero, which indicates how many iterations of the animation have occurred.
... finally, we set up a handler for a click on the button that runs the animation: document.getelementbyid("play").addeventlistener("click", function(event) { box.style.animationplaystate = "running"; iterationcounter++; }, false); this sets the box element's animation-play-state to "running" and increments the iteration counter.

GlobalEventHandlers - Web APIs
globaleventhandlers.onplay is an eventhandler representing the code to be called when the play event is raised.
... globaleventhandlers.onplaying is an eventhandler representing the code to be called when the playing event is raised.

HTMLMediaElement: play event - Web APIs
bubbles no cancelable no interface event target element default action none event handler property globaleventhandlers.onplay specification html5 media examples these examples add an event listener for the htmlmediaelement's play event, then post a message when that event handler has reacted to the event firing.
...either the ' + 'play() method was called or the autoplay attribute was toggled.'); }); using the onplay event handler property: const video = document.queryselector('video'); video.onplay = (event) => { console.log('the boolean paused property is now false.

HTMLMediaElement: playing event - Web APIs
bubbles no cancelable no interface event target element default action none event handler property globaleventhandlers.onplaying specification html5 media examples these examples add an event listener for the htmlmediaelement's playing event, then post a message when that event handler has reacted to the event firing.
... using addeventlistener(): const video = document.queryselector('video'); video.addeventlistener('playing', (event) => { console.log('video is no longer paused'); }); using the onplaying event handler property: const video = document.queryselector('video'); video.onplaying = (event) => { console.log('video is no longer paused.'); }; specifications specification status html living standardthe definition of 'playing media event' in that specification.

animation - CSS: Cascading Style Sheets
('.animation')); var button = array.from(document.queryselectorall('button')); function togglebutton (btn, type) { btn.classlist.remove('play', 'pause', 'restart'); btn.classlist.add(type); btn.title = type.touppercase(type); } function playpause (i) { var btn = button[i]; var anim = animation[i]; if (btn.classlist.contains('play')) { anim.style.animationplaystate = 'running'; togglebutton(btn, 'pause'); } else if (btn.classlist.contains('pause')) { anim.style.animationplaystate = 'paused'; togglebutton(btn, 'play'); } else { anim.classlist.remove('a' + (i + 1)); settimeout(function () { togglebutton(btn, i === 0 ?
... 'play' : 'pause'); anim.style.animationplaystate = ''; anim.classlist.add('a' + (i + 1)); }, 100) } } animation.foreach(function (node, index) { node.addeventlistener('animationstart', function () { togglebutton(button[index], 'pause'); }); node.addeventlistener('animationend', function () { togglebutton(button[index], 'restart'); }); }); button.foreach(function (btn, index) { btn.addeventlistener('click', function () { playpause(index); }); }); }) a description of which properties are animatable is available; it's worth noting that this description is also valid for css transitions.

Autoplay guide for media and Web Audio APIs - Web media technologies
consider this html for a media element: <video src="myvideo.mp4" autoplay onplay=handlefirstplay(event)"> here we have a <video> element whose autoplay attribute is set, with an onplay event handler set up; the event is handled by a function called handlefirstplay(), which receives as input the play event.
... handlefirstplay() looks like this: function handlefirstplay(event) { let vid = event.target; vid.onplay = null; // start whatever you need to do after playback has started } after getting a reference to the video element from the event object's target, the element's onplay handler is set to null.

Introduction to events - Learn web development
it makes sense to use onplay only on specific elements, such as <video>).