宜昌本地软件开发与弱电工程服务商
项目咨询 · 快速响应

[html5]html5技术onvolumechange事件控制静音

2016-10-13 00:16:48 点击量:13 标签: 收藏本文

[html5]html5技术onvolumechange事件控制静音

  1. 在此页面的结尾处尝试该示例并注意外部按钮和视频对象中的内置控件如何保持同步。 
  2.  
  3. 以对 onvolumechange 事件使用相同的技术以控制静音按钮上的图形。由于没有单独的静音和音量事件,因此下一示例使用 onvolumechange 来处理两个状态。 

 

  1. video.addEventListener("volumechange", function () { 
  2.     if (video.muted) { 
  3.         // if muted, show mute image 
  4.         document.getElementById("mute").innerHTML = "<img alt='volume off button' src='mute2.png' />" 
  5.     } else { 
  6.         // if not muted, show not muted image 
  7.         document.getElementById("mute").innerHTML = "<img alt='volume on button' src='vol2.png' />" 
  8.     } 
  9. }, false);