您的位置:首页 > Web前端 > HTML5

DayDayUP之HTML5学习笔记四----使用Video标签制作简单的播放器

2014-04-22 15:54 951 查看
HTML5支持的视频格式为:OGG、WebM、MEPG4。



代码片段:

    <video id="video" src="3.webm" controls="controls" width="400" height="300"></video>

    <script>
   var video=document.getElementById('video');
//播放视频 
   function playMedia()
{
  video.play();
}
//视频暂停
function pauseMedia()
{
  video.pause();
}
//快进5s
function fastForward()
{
  video.currentTime += 5;
}
//快退5s
function rewind()
{
   video.currentTime -= 5;
}
//静音
function mute(obj)
{
   if(video.muted)
{
  video.muted=false;
  obj.innerHTML="静音";
}else
{
    video.muted=true;
    obj.innerHTML="不静音";
}
  
}
//音量加。注意:音量的值为0~1
function volumeUp()
{
   //默认值为0-1
   video.volume+=0.1;
}
//音量减。注意:音量的值为0~1
function volumeDown()
{
   video.volume-=0.1;
}
//加速播放
function acceleratedplay()
{
   video.playbackRate=5;
}
   //正常播放
function Normalplay()
{
   video.playbackRate=1;
}
//减速播放。注意:正常默认的速度为1
function decelerationplay()
{
   video.playbackRate=1/5;
}
</script>

      
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息