HTML5 - Get audio and video started together?

Problem

How would I go about getting audio and video started exactly at the same time using <audio> and <video>? JavaScript is fine (and is probably needed).

Thanks!

Problem courtesy of: user775171

Solution

You didn't say anything about file types so I used HTML-5 formats that work in Safari.

<!DOCTYPE>
    <meta charset="UTF-8">
    <title> audio video</title>

    <audio id="audioInHTML" controls="controls">     
    <source src="audio.wav" type="audio/wav"/>
    </audio>
    </div>

    <video id="videoInHTML" width="320" height="240" controls="controls">
      <source src="movie.mp4" type="video/mp4" />
    </video>

    <div id="playButtonDiv" </div>

    <form>
    <input type="button" value="PlaySoundAndVideo" onClick="PlaySoundAndVideo('videoInHTML'),PlaySoundAndVideo('audioInHTML')">

    </div>

    <script>

    function PlaySoundAndVideo(soundObj,videoObj) {
    var soundAndVideo=document.getElementById(soundObj,videoObj);
    soundAndVideo.play();
    }


    </script>

    <style type="text/css">


    #playButtonDiv {
    position:absolute;
    top:800px;

    };   

    </style>
Solution courtesy of: William

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.