zoukankan      html  css  js  c++  java
  • createVideoControls与addControls函数

    function createVideoControls() {
      var vids = document.getElementsByTagName('video');
      for (var i = 0 ; i < vids.length ; i++) {
        addControls( vids[i] );
      }
    }
    
    function addControls( vid ) {
    
      vid.removeAttribute('controls');
    
    
      vid.height = vid.videoHeight;
      vid.width = vid.videoWidth;
      vid.parentNode.style.height = vid.videoHeight + 'px';
      vid.parentNode.style.width = vid.videoWidth + 'px';
    
      var controls = document.createElement('div');
      controls.setAttribute('class','controls');
        
      var play = document.createElement('button');
      play.setAttribute('title','Play');
      play.innerHTML = '&#x25BA;';
       
      controls.appendChild(play);
     
      vid.parentNode.insertBefore(controls, vid);
      
      play.onclick = function () {
        if (vid.ended) {
          vid.currentTime = 0;
        }
        if (vid.paused) {
          vid.play();
        } else {
          vid.pause();
        }
      };  
      
      vid.addEventListener('play', function () {
        play.innerHTML = '&#x2590;&#x2590;';
        play.setAttribute('paused', true);
      }, false);
      
      vid.addEventListener('pause', function () {
        play.removeAttribute('paused');
        play.innerHTML = '&#x25BA;';
      }, false);
      
      vid.addEventListener('ended', function () {
        vid.pause();
      }, false);
    }
    addLoadEvent(createVideoControls);
    addLoadEvent(addControls);

    自定义视频插件

  • 相关阅读:
    【HDOJ】2267 How Many People Can Survive
    【HDOJ】2268 How To Use The Car
    【HDOJ】2266 How Many Equations Can You Find
    【POJ】2278 DNA Sequence
    【ZOJ】3430 Detect the Virus
    【HDOJ】2896 病毒侵袭
    求奇数的乘积
    平方和与立方和
    求数列的和
    水仙花数
  • 原文地址:https://www.cnblogs.com/CClarence/p/4915864.html
Copyright © 2011-2022 走看看