html5 视频播放控件

  <link href="css/default.css" rel="stylesheet" type="text/css" />
  <style>
            #video-column {
              float: left;
              width: 50%;
              margin-top: 20px;
            }
            #reflection-button {
              margin: 20px 0;
            }
            #audio-column {
              float: left;
              width: 45%;
              margin-top: 120px;
            }
            .media-buttons {
              margin: 40px 0;
            }
          </style>
<div id="video-column" class="center">
              <input type="button" id="reflection-button" οnclick="addReflection()" value="Add CSS reflection to video" />
              <video width="390" id="clip" controls>
                <source src="src/chrome_japan.webm" type='video/webm; codecs="vp8, vorbis"' />
                <source src="src/chrome_japan.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
                <source src="src/chrome_japan.ogv" type='video/ogg; codecs="theora, vorbis"' />
                Your browser does not support the video tag
              </video>
              <div class="media-buttons">
                <input type="button" id="play-button" οnclick="PlayVideo()"; value="Play" />
                <input type="button" id="pause-button" οnclick="PauseVideo()"; value="Pause" disabled />
                <input type="button" id="mute" οnclick="MuteUnMute()" value="Mute" />
              </div>
            </div>