Skip to content

Instantly share code, notes, and snippets.

@bkeepers bkeepers/usage.coffee

Last active Feb 12, 2019
Embed
What would you like to do?
Keep two HTML5 video elements in sync.
videos = document.getElementsByTagName('video')
new VideoSync(videos[0], videos[1])
# Keep two HTML5 video elements in sync.
#
# @primary - primary video with controls and audio
# @secondary - secondary video,
class @VideoSync
constructor: (@primary, @secondary) ->
@ready = false
@secondary.addEventListener 'canplay', => @ready = true
@primary.addEventListener 'play', => @secondary.play()
@primary.addEventListener 'pause', => @secondary.pause()
@primary.addEventListener 'timeupdate', @sync
@primary.addEventListener 'seeking', @sync
sync: =>
@secondary.currentTime = @primary.currentTime if @ready
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.