zoukankan      html  css  js  c++  java
  • 【webrtc】视频特效的添加(15)

    文档gitbook地址

    文档github地址

    invert

    none

    gray
    在这里插入图片描述

    sepia

    //html
    <!DOCTYPE html>
    <html>
    <head>
      <title>webrtc test</title>
      <style>
          .none{
              -webkit-filter:none;
          }
          .blur{
            -webkit-filter:blur(3px);
          }
          .grayscale{
              -webkit-filter:grayscale(1);
          }
          .invert{
              -webkit-filter:invert(1);
          }
          .sepia{
              -webkit-filter:sepia(1);
          }
      </style>
    </head>
    <body>
        <div>
            <label>audioSource音频输入: </label>
            <select id="audioSource">
        </select>
        </div>
        <div>
            <label>audioOutput音频输出: </label>
            <select id="audioOutput">
        </select>
        </div>
        <div>
            <label>videosource: </label>
            <select id="videoSource">
        </select>
        </div>
        <div>
            <label>filter加一点点特效: </label>
            <select id="filter">
                <option value='none'>None</option>
                <option value='bluer'>Blur</option>
                <option value='grayscale'>grayscale</option>
                <option value='invert'>invert</option>
                <option value='sepia'>sepia</option>
            </select>
        </div>
        
    
        <video autoplay playsinline id = 'player'></video>
        <script src="./lib/adapter-latest.js"></script>
        <script src="./js/client.js"></script>  
    </body>
    </html>
    
    //改变video的class;通过样式来设置效果
    filtersSelect.onchange = function(){        //视频特效
        videoplay.className = filtersSelect.value;
    }
    
    
  • 相关阅读:
    关于iOS中页面启动加载的相关问题汇总
    文件上传与解析漏洞
    XSS跨站攻击
    SQL注入
    DOS&&Linux命令大全
    信息收集相关
    进制转化
    PYQT5 in Python
    将博客搬至CSDN
    Python报文操作模块scapy
  • 原文地址:https://www.cnblogs.com/smileyqp/p/12675301.html
Copyright © 2011-2022 走看看