音量调节及静音
只剩下音量控制的问题了，首先让我们来实现简单的on/off。我们再次用Unicode为按钮制作标签，这一次用到的是横向八音符(&mxB;):
value=,,&mxB;Monclick=Mmute(this)">
宁波网站建设认为mute()功能使用读/写属性video.muted来设置静音或是恢复音量。为了让用户得到视觉反馈，静音时按钮标签依CSS显示为银色，声音打开时为黑色：
varmute=functionfCtrl){if(video.muted){video.muted=false;Ctrl.style.color='black*;else{
video.muted=true;
Ctrl,style.color='silver1;
}；
调节音量的功能并不复杂，除了用Input类型range创建滑块外，我们还需要用span来控制这个标签。因此音量设置的基本代码结构如下：
min=max=l.Ostep=0.lvalue=l,0onchange=,,adiustVolume(this),7>
〈spanid=,'currentVolume,,>
我们定义span元素指向initControls()，它可以用video.volume将音量重置为%:
curVol=document.getElementById(McurrentVolumen);curVol.innerHTML="%M;video.volume=1；当滑块位置改变时，将调用adjustVolume()函数作出响应。音量video.volume的取值范围在min=0与max=l之间，因此我们设置step=，当拖动音量滑块时，以10°/。
为阶梯来调节音量。
varadjustVolume=function(ctrl){video.volume=Ctrl.value;curVol.innerHTML=(Math.round(ctrl.value*))+'%';}；现在，我们的视频播放器终于大功告成了。这一实用案例让你得以深入了解HTMLMediaElement接口中将近一半的属性及方法，还有一些有趣的属性和方法没介绍到，我们接下来会继续了解。
HTMLMediaElement接口中其他的属性及方法所有媒体元素(包括视频和音频)都拥有五个常见属性，它们也都出现在HTMLMediaElement接口中。除了作为媒体流的源的src之外，还有布尔型属性autoplay、loop及controls，另外还有preload及其3个值none、metadata及auto。我们通过以下代码构建一个视频。
varvideo=document.createElement(MVIDEO1*);video.src='videos/bbb_240p_stereo.ogv';video.autoplay=false;一video.loop=true;
video.controls=true;
video.preload='metadata1;
视频目前还没有加载。HTMLMediaElement的另一个方法video.load()会执行加载处理。为了能让视频在浏览器中播放，我们还需要将它加入到DOM树中，因此我们再加人两行代码：
video.load();
document.documentElement.appendChild(video);视频播放器的video元素oncanplay属性的动态副本属性是一个事件监听器。这个监听器包括事件类型、回调函数、以及一个用于判断是否置于捕获状态(capturephase)的标志位。若你对此难以理解，试试将标志位(第三个参数)改为false,将事件监听器置于冒泡状态(capturephase)。如果你想了解关于事件生效顺序的细节，请访问http://www.quirksmode.org/js/events_order.htm旦监听器侦测到eanplay事件，就会立即控制播放相应视频：
video.addEventListener("eanplay",function(){video.play();},false);
本文由乐华网络编辑，转载请注明出处
宁波网站建设www.leseo.net
